SVG endlessly

All flavors welcome.
Forum rules
Be kind.
Post Reply
User avatar
richmond62
Posts: 2772
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

SVG endlessly

Post by richmond62 »

From another forum:
So we don't have SVG export huh?
https://forums.livecode.com/viewtopic.p ... 2&start=30
https://richmondmathewson.owlstown.net/
User avatar
OpenXTalkPaul
Posts: 1574
Joined: Sat Sep 11, 2021 4:19 pm
Contact:

Re: SVG endlessly

Post by OpenXTalkPaul »

richmond62 wrote: Sun Feb 18, 2024 11:13 am From another forum:
So we don't have SVG export huh?
https://forums.livecode.com/viewtopic.p ... 2&start=30
function wrapSVGPathDataToSVGXML pSVGPathData
The handler that I posted in the lastest post in that thread,

Code: Select all

on mouseDown pButtonNumber
   ASK FILE "SAVE AS SVG..."
   if it is not empty then
      put it into tFileName
      put wrapSVGPathDataToSVGXML( the iconPath of widget "SVGIconDisplay") into rSVGXML
      open file tFileName
      write rSVGXML to file tFileName
      close file tFileName
   end if
end mouseDown

function wrapSVGPathDataToSVGXML pSVGPathData
   put "<?xml version="&quote&"1.0"&quote&" standalone="&quote&"no"&quote&"?>" & cr into pSVGXML
   put "<!DOCTYPE svg PUBLIC "&quote&"-//W3C//DTD SVG 20010904//EN"&quote&" "&quote&"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"&quote&">" &cr after pSVGXML
   put "<svg version="&quote&"1.0"&quote&" xmlns="&quote&"http://www.w3.org/2000/svg"&quote&cr after pSVGXML
   put "preserveAspectRatio="&quote&"xMidYMid meet"&quote&">" &cr after pSVGXML
   put "<path d="&quote& the iconPath of widget "SVGIconDisplay" &quote&" />" & cr after pSVGXML
   put "</svg>"  after pSVGXML
   return  pSVGXML
end wrapSVGPathDataToSVGXML
takes an SVG Path String (like those stored in the iconPath property of SVG Icon widget) as a parameter and returns it formatted into being a valid .svg file data that can then be written to disk (or to the clipBoard) for use in other external vector graphics app.
User avatar
richmond62
Posts: 2772
Joined: Sun Sep 12, 2021 11:03 am
Location: Bulgaria
Contact:

Re: SVG endlessly

Post by richmond62 »

takes an SVG Path String (like those stored in the iconPath property of SVG Icon widget) as a parameter and returns it formatted into being a valid .svg file data that can then be written to disk (or to the clipBoard) for use in other external vector graphics app.
No doubt.

But what it does NOT do is export an image on a card in SVG format:

Pseudo Code:

Code: Select all

export snapshot from image "MyBigFeet" to file "MyBigFeet.svg" as SVG
in the way you CAN do this sort of thing:

Code: Select all

export snapshot from image "MyBigFeet" to file "MyBigFeet.png" as PNG
https://richmondmathewson.owlstown.net/
User avatar
OpenXTalkPaul
Posts: 1574
Joined: Sat Sep 11, 2021 4:19 pm
Contact:

Re: SVG endlessly

Post by OpenXTalkPaul »

richmond62 wrote: Sun Feb 18, 2024 10:00 pm
takes an SVG Path String (like those stored in the iconPath property of SVG Icon widget) as a parameter and returns it formatted into being a valid .svg file data that can then be written to disk (or to the clipBoard) for use in other external vector graphics app.
No doubt.

But what it does NOT do is export an image on a card in SVG format:

Pseudo Code:

Code: Select all

export snapshot from image "MyBigFeet" to file "MyBigFeet.svg" as SVG
in the way you CAN do this sort of thing:

Code: Select all

export snapshot from image "MyBigFeet" to file "MyBigFeet.png" as PNG
I have written handlers that do that too.
You can't export a snapshot of a path string(s) as an image because it's not an image, it's numeric description of a shapes, or more accurately instructions for drawing line(s), in the same way that MIDI is not actual sound but a numeric description of a musical performance. What you CAN do is export a snapshot of the Widget or Graphic Control that's already drawn the lines.

Code used in that OpenXTalk DPE revSVGGlyphBrowser palette:

Code: Select all

   export snapshot from widget "SVGGlyph" without effects to tImage as PNG
   set the text of image "dragImage" to tImage
We could've saved tImage as a PNG file there, but NOT as vector SVG file.

Nice thing about this is that it preserves transparent areas as alpha/transparency in the output PNG, even if using effects like a drop-shadow.

The one gotcha here is that by default it makes a pixel image that has the vector shape drawn filled with black pixels, even if the path in the widget was filled white because of darkMode. Explicitly setting the fill color property of the widget first might help in changing its color, or you could apply a color overlay to it first before exporting, if you need the pixels filled with a specific color.

There's no such thing as exporting an Image to an SVG, not even in programs like Adobe illustrator (and they invented SVG), what there is in apps like that is auto-tracing of pixels into approximations using vector path shapes (which can take a LOT of processing power if you have generated tens of thousands of vector paths with millions of points, believe me I know this stuff).
Post Reply

Who is online

Users browsing this forum: No registered users and 14 guests