Export to Vector

Something you want to see in a LiveCode product? Want a new forum set up for a specific topic? Talk about it here.

Moderators: Klaus, FourthWorld, heatherlaine, kevinmiller, robinmiller

Post Reply
richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 1892
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Export to Vector

Post by richmond62 » Sat Sep 09, 2017 3:33 pm

Export snapshot from group "XXX" to file "XXX.svg" as SVG

Import snapshot from group "XXX" as graphic

fantasy-land at the moment.

Here's the sort of thing I'd like to convert into a vector image:
vectoriseMe.png
vectoriseMe.png (5.47 KiB) Viewed 681 times

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 1892
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Export to Vector

Post by richmond62 » Sat Sep 09, 2017 3:55 pm


[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1538
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Export to Vector

Post by [-hh] » Sat Sep 09, 2017 4:31 pm

shiftLock happens

FourthWorld
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 5379
Joined: Sat Apr 08, 2006 7:05 am
Location: Los Angeles
Contact:

Re: Export to Vector

Post by FourthWorld » Sat Sep 09, 2017 6:50 pm

What format do you want to export to?
Richard Gaskin
Community volunteer LiveCode Community Liaison

LiveCode development, training, and consulting services: Fourth World Systems: http://FourthWorld.com
LiveCode User Group on Facebook : http://FaceBook.com/groups/LiveCodeUsers/

ClipArtGuy
Posts: 90
Joined: Wed Aug 19, 2015 4:29 pm

Re: Export to Vector

Post by ClipArtGuy » Sat Sep 09, 2017 7:46 pm

I've been shelling out to potrace CLI for simple two color images, but it looks like autotrace might be a good choice for multi-colored graphics. I will definitely be giving it a whirl this weekend.

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 1892
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Export to Vector

Post by richmond62 » Sat Sep 09, 2017 8:12 pm

I should like to export to SVG so that . . .

oddly enough . . .

they could be reimported into a Livecode stack as SVG widgets.

capellan
Posts: 379
Joined: Wed Aug 15, 2007 11:09 pm
Contact:

Re: Export to Vector

Post by capellan » Sat Sep 09, 2017 9:42 pm

Hi Richmond,

Check if this code works fine in your own setup within the MultiColor SVG widget and download attached files too:

Code: Select all

<rect x="0" y="0" width="33.5" height="33.5" style="fill:none;stroke-width:0px;stroke:rgb(0,0,0);"/>

<path d="M 11.564536,32.151906 V 21.608438 H 1.0207157 V 11.475249 H 11.564536 V 0.93142752 h 10.13319 V 11.475249 h 10.54347 v 10.133189 h -10.54347 v 10.543468Z" style="fill:white;fill-rule:nonzero;"/>

<path d="M 11.564536,32.151906 V 21.608438 H 1.0207157 V 11.475249 H 11.564536 V 0.93142752 h 10.13319 V 11.475249 h 10.54347 v 10.133189 h -10.54347 v 10.543468Z" style="fill:none;stroke-width:1px;stroke:rgb(0,0,0);"/>

<circle cx="16.5" cy="16.5" r="4" style="fill:rgb(0,0,0);fill-rule:nonzero;"/>

<path d="m 27.454706,17.473177 v 0.01905 h 1.85914 v 0.836789 h -3.01555 V 17.54338 l 1.31269,-1.255536 c 0.26423,-0.253295 0.45014,-0.465667 0.55739,-0.637117 0.1076,-0.17145 0.16122,-0.352072 0.16122,-0.541514 0,-0.421922 -0.22649,-0.632531 -0.68016,-0.632531 -0.39405,0 -0.77082,0.156634 -1.131,0.469548 v -0.887942 c 0.39828,-0.257881 0.84772,-0.386644 1.34831,-0.386644 0.46849,0 0.83432,0.117827 1.09714,0.35313 0.26317,0.235303 0.39441,0.553156 0.39441,0.953558 0,0.534459 -0.32032,1.086909 -0.96132,1.657703 z" style="fill:rgb(0,0,0);fill-rule:nonzero;"/>

<path d="M 18.537932,8.4618206 H 15.640348 V 7.6631482 h 0.948823 v -2.852858 l -0.97438,0.2108495 V 4.2032992 l 1.980707,-0.3993363 v 3.8591853 h 0.942434 z" style="fill:rgb(0,0,0);fill-rule:nonzero;"/>

<path d="m 7.8861257,17.316543 h -0.54963 v 0.97402 h -0.92005 v -0.97402 h -1.99637 v -0.642055 l 1.923,-2.964744 h 0.99342 v 2.887838 h 0.54963 z m -1.45698,-2.597149 h -0.019 c -0.0296,0.07655 -0.0871,0.195791 -0.1725,0.357716 l -0.98073,1.520472 h 1.15958 v -1.440744 c 0,-0.127706 0.004,-0.273403 0.0127,-0.437444 z" style="fill:rgb(0,0,0);fill-rule:nonzero;"/>

<path d="m 15.616186,28.600139 v -0.878416 c 0.30657,0.223663 0.66428,0.335491 1.07315,0.335491 0.25753,0 0.45826,-0.05539 0.60219,-0.166158 0.14358,-0.11077 0.21555,-0.265287 0.21555,-0.463195 0,-0.204613 -0.0889,-0.362304 -0.2667,-0.473076 -0.1778,-0.110772 -0.42227,-0.165806 -0.73307,-0.165806 h -0.41205 v -0.773288 h 0.37995 c 0.59654,0 0.89464,-0.197909 0.89464,-0.594078 0,-0.372534 -0.22895,-0.559153 -0.68686,-0.559153 -0.30656,0 -0.60501,0.09913 -0.89464,0.297039 V 24.33541 c 0.32173,-0.161572 0.69638,-0.242711 1.12465,-0.242711 0.46849,0 0.83326,0.10548 1.09397,0.316442 0.26105,0.210608 0.39158,0.484363 0.39158,0.820913 0,0.598312 -0.30374,0.973314 -0.91052,1.124303 v 0.01623 c 0.3235,0.04022 0.57926,0.157692 0.76659,0.352778 0.18732,0.194733 0.28116,0.433917 0.28116,0.717199 0,0.427918 -0.15663,0.766585 -0.46955,1.016 -0.31291,0.24906 -0.74542,0.373591 -1.29716,0.373591 -0.47272,0 -0.8569,-0.07655 -1.15288,-0.230013 z" style="fill:rgb(0,0,0);fill-rule:nonzero;"/>
Notice that compressed stack does not include this code at the top of Multicolor SVG widget:

<rect x="0" y="0" width="33.5" height="33.5" style="fill:none;stroke-width:0px;stroke:rgb(0,0,0);"/>

You could include it yourself at the top of Multicolor SVG widget within the attached LC8 stack, in this way I do not have to upload again these files.

Al
Richmond_Drawing.zip
LC8 Stack and SVG file
(3.84 KiB) Downloaded 10 times
Last edited by capellan on Sat Sep 09, 2017 11:18 pm, edited 1 time in total.

bogs
Posts: 599
Joined: Sat Feb 25, 2017 10:45 pm

Re: Export to Vector

Post by bogs » Sat Sep 09, 2017 10:41 pm

ClipArtGuy wrote:
I've been shelling out to potrace CLI for simple two color images, but it looks like autotrace might be a good choice for multi-colored graphics. I will definitely be giving it a whirl this weekend.
Heya ClipArtGuy, You have seen these, right? I've tried Ian's and -hh's, both seem to work pretty good.
Image
ImageImage

capellan
Posts: 379
Joined: Wed Aug 15, 2007 11:09 pm
Contact:

Re: Export to Vector

Post by capellan » Sun Sep 10, 2017 4:38 am

richmond62 wrote:I should like to export to SVG so that . . .
oddly enough . . .
they could be reimported into a Livecode stack as SVG widgets.
Hi Richmond,

Download this really old stack:
http://andregarzia.on-rev.com/alejandro ... or_v03.zip

Open the stack exportVector_v03, erase all vector graphics
and paste your vector graphics. Then, select from
SVG, PDF or Adobe Ilustrator and click: Export

Post in Google Drive or Dropbox your results or paste
them in the forum.

Could this handler still be useful after so many years?
Notice that SVG export is based in a script posted
by Richard Gaskin.

Al

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 1892
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Export to Vector

Post by richmond62 » Sun Sep 10, 2017 11:00 am

Download this really old stack:
The stack does export graphic objects created within a Livecode stack.

What it does NOT do is turn a group of raster images into a vector and export it.

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 1892
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Export to Vector

Post by richmond62 » Sun Sep 10, 2017 1:01 pm

Multicolor SVG widget
Where?

The only way I am aware of currently to have a vector image that is properly manageable
is to have a few SVG widgets (one for each colour) layered on top of each other.

capellan
Posts: 379
Joined: Wed Aug 15, 2007 11:09 pm
Contact:

Re: Export to Vector

Post by capellan » Sun Sep 10, 2017 7:36 pm

Download attached lcb file from this Mark Wieder's forum post:
viewtopic.php?f=93&t=27811&start=30#p154437

In another forum thread, Mark Wieder posted an updated version of Peter Thirkell widget's "MultiColor SVG widget" but I could not find this specific message. Ask Mark Wieder for a link to download his most recent version of this widget.

In this forum (or LC mail list?), Bernd posted a stack that could trace color bitmaps as vectors, but I could not find a link to this specific color tracing stack, download this previous version (only single color tracing):
viewtopic.php?f=10&t=19040
Ask Bernd for a download link of his color tracing stack.

Recently, Hermann posted a stack that simplify these traced bitmaps graphics (reducing the number of points):
phpBB2/viewtopic.php?f=76&t=19248&start=90#p157049

If you want to smooth these traced vector graphics, then you could try one of these algorithms:
http://andregarzia.on-rev.com/alejandro ... orithm.zip

By the way, Inkscape could trace color bitmaps (convert bitmaps into vector images) but you will get better results if you redraw these bitmaps using a vector graphic editor. Check attached files to this message. According to professional reviews, the best tool for tracing bitmap images is Vector Magic:
https://vectormagic.com/comparisons

Finallly, download this updated version of a stack that exports vector graphics from LiveCode
as PDF, Adobe Ilustrator and SVG: viewtopic.php?f=10&t=29742
Use Inkscape 0.92 or later to edit SVG exported from this updated stack.

Al
ForRichmond.PNG
Comparison of a traced vs a redraw bitmap
ForRichmond.zip
SVG compressed file
(10.23 KiB) Downloaded 12 times

Post Reply

Return to “Feature Requests”