PureSVG - now with LoadSVG() !

Share your advanced PureBasic knowledge/code with the community.
Seymour Clufley
Addict
Addict
Posts: 1233
Joined: Wed Feb 28, 2007 9:13 am
Location: London

PureSVG - now with LoadSVG() !

Post by Seymour Clufley »

This "library" enables you to draw an SVG image using analogues of 2DDrawing's commands.

The following things are possible:
  • primitives (lines, curves, texts, raster images, etc.)
  • attributes
  • classes
  • gradients
  • patterns
  • masking
  • mouse actions
  • JavaScript
  • metadata
Here's a zip containing the code and the help file.

Happy new year, everyone!
Seymour.
Last edited by Seymour Clufley on Sun Jan 30, 2022 1:01 pm, edited 11 times in total.
JACK WEBB: "Coding in C is like sculpting a statue using only sandpaper. You can do it, but the result wouldn't be any better. So why bother? Just use the right tools and get the job done."
Seymour Clufley
Addict
Addict
Posts: 1233
Joined: Wed Feb 28, 2007 9:13 am
Location: London

Re: SVG "drawing"

Post by Seymour Clufley »

EDIT: this post was a kind of "help file". We don't need it anymore.
Last edited by Seymour Clufley on Thu Jan 07, 2010 2:04 pm, edited 1 time in total.
JACK WEBB: "Coding in C is like sculpting a statue using only sandpaper. You can do it, but the result wouldn't be any better. So why bother? Just use the right tools and get the job done."
srod
PureBasic Expert
PureBasic Expert
Posts: 10589
Joined: Wed Oct 29, 2003 4:35 pm
Location: Beyond the pale...

Re: SVG "drawing"

Post by srod »

Very very interesting Seymour; thanks for this great contribution.

Must admit that I have never used SVG, but your posting makes me want to dive in and get to grips with it all. Some nice possibilities present themselves. :)

Think I'll grab a cup of coffee and have a good read through your code.

8)

Thanks again.
Last edited by srod on Tue Jan 05, 2010 11:47 am, edited 1 time in total.
I may look like a mule, but I'm not a complete ass.
Foz
Addict
Addict
Posts: 1359
Joined: Tue Nov 13, 2007 12:42 pm
Location: Manchester, UK

Re: SVG "drawing"

Post by Foz »

I like SVGs, I really do, but Windows never seems to like them - does anyone have a suggestion for a good windows SVG viewer?
Seymour Clufley
Addict
Addict
Posts: 1233
Joined: Wed Feb 28, 2007 9:13 am
Location: London

Re: SVG "drawing"

Post by Seymour Clufley »

srod wrote:Very very interesting Seymour; thanks for this great contribution.
Thank you, srod. This is my first contribution to T&T. The approval of srod is a good sign!
Must admit that I have never used SVG, but your posting makes me want to dive in and get to grips with it all. Some nice possibilities present themselves. :)
Well, this was my intention, to make SVG more available to PB programmers. To make it simple instead of daunting.
Foz wrote:does anyone have a suggestion for a good windows SVG viewer?
I'm sure there are standalone viewers, but my first thought was Chrome or Opera. I know for a fact they work very well.
JACK WEBB: "Coding in C is like sculpting a statue using only sandpaper. You can do it, but the result wouldn't be any better. So why bother? Just use the right tools and get the job done."
User avatar
idle
Always Here
Always Here
Posts: 5042
Joined: Fri Sep 21, 2007 5:52 am
Location: New Zealand

Re: SVG "drawing"

Post by idle »

thanks looks really interesting, just wish I had the time to look at it right now.
User avatar
Rings
Moderator
Moderator
Posts: 1427
Joined: Sat Apr 26, 2003 1:11 am

Re: SVG "drawing"

Post by Rings »

very interesting stuff.
What about writing a viewer (no , not a web-browser) or some routines
to write the SVG to a image/sprite ourselves here ?
Cannot be to different (except the scripting stuff)
with only the primitives and gradients.....
SPAMINATOR NR.1
dige
Addict
Addict
Posts: 1247
Joined: Wed Apr 30, 2003 8:15 am
Location: Germany
Contact:

Re: SVG "drawing"

Post by dige »

I've fixed the missing R() Procedure, but the provided example
does not work here (PB4.40x86, Win7 x86).
FormSVGCode(s) retruns ""

Anyone have already successfully tested?
Seymour Clufley
Addict
Addict
Posts: 1233
Joined: Wed Feb 28, 2007 9:13 am
Location: London

Re: SVG "drawing"

Post by Seymour Clufley »

Dige,

I thought R() was included in the code. It's just a macro for MessageRequester, so that I only have to type one letter in the code. ;)

Please try this code:

Code: Select all

s = CreateSVG(#PB_Any)
SVG_StartDrawing(s)
SVG_Box(0,0,100,100,#Green)
SVG_StopDrawing()
SaveSVG(s,"C:\test.svg")
If that doesn't work, what is the result of IsSVG(s) ?

If it isn't 1, what's the result of this code:

Code: Select all

z = ArraySize(svgmem(),1)
JACK WEBB: "Coding in C is like sculpting a statue using only sandpaper. You can do it, but the result wouldn't be any better. So why bother? Just use the right tools and get the job done."
User avatar
einander
Enthusiast
Enthusiast
Posts: 744
Joined: Thu Jun 26, 2003 2:09 am
Location: Spain (Galicia)

Re: SVG "drawing"

Post by einander »

@Seymour:
Nice job! Thanks for sharing.

@Dige
Tested successfully with Pb 4.40 & Win7, replacing the missing R() for MessageRequester.
Seymour Clufley
Addict
Addict
Posts: 1233
Joined: Wed Feb 28, 2007 9:13 am
Location: London

Re: SVG "drawing" (IMPROVED!)

Post by Seymour Clufley »

New version! See original post for download link (code is now too long for forum to accept).

Added: SVG_SetElementOpacity()
Added: SVG_SetElementCursor()

Added: SVG_SetMetadataString()
Added: SVG_SetMetadataInteger()
Added: SVG_ClearMetadata()
Removed: SVG_SetDescription() - changed to SVG_SetMetadataString(#SVG_Metadata_Description,desc$)

Added: SVG_ClearPath()
Improved: path storage system
Simplified: path writing commands.

Added: SVG_AbsorbExternalStylesheet()

Added: SVG_CopyElement()
Added: SVG_RemoveElement()
Added: SVG_MoveElement()
Added: SVG_ShiftElement()
Last edited by Seymour Clufley on Sat Jan 16, 2010 8:09 pm, edited 1 time in total.
JACK WEBB: "Coding in C is like sculpting a statue using only sandpaper. You can do it, but the result wouldn't be any better. So why bother? Just use the right tools and get the job done."
Seymour Clufley
Addict
Addict
Posts: 1233
Joined: Wed Feb 28, 2007 9:13 am
Location: London

Re: PureSVG (updated 16/Jan/10)

Post by Seymour Clufley »

New version!

It's now called PureSVG.

Many bugs and incomplete commands have been fixed. I apologise for the state of the library in v2; I was very enthusiastic about it and was too eager to put it on the forum.

Anyway, with v3 I have simplified how some of the commands work and added many new commands. See the Version History for details.

Be aware that SVG_Path_LineV2() now takes mid-points using the included PointF structure instead of POINT.

There are now some "helper" commands to take care of tedious shape building: SVG_RegularPolygon, SVG_Arrow, and SVG_CircleSegment which should be useful for pie charts.

Here's a pie chart demo:

Code: Select all

Structure PieChartSlice
  name.s
  value.f
  color.i
EndStructure
Structure PieChart
  slices.i
  slice.PieChartSlice[25]
EndStructure

Procedure.i SVGPieChart(*p.PieChart,title.s,description.s)
  
  s = CreateSVG(#PB_Any,title,description)
  SVG_StartDrawing(s)
  SVG_SetBackground(#SVG_FillMode_Color,#Black)
  
  total.f
  For a = 1 To *p\slices
      total + *p\slice[a]\value
  Next a
  
  d.f = 800
  r.f = d/2
  cx.f = r
  cy.f = r
  
  
  fontname.s = "Courier New"
  fontsize = 12
  
  Dim text_angle.f(*p\slices)
  
  startangle.f = -90
  For a = 1 To *p\slices
      clr = *p\slice[a]\color
      
      deg_arc.f = 360/total**p\slice[a]\value
      SVG_CircleSegment(cx,cy,r,Degrees2Radians(deg_arc),Degrees2Radians(startangle),clr)
      SVG_SetElementStroke(#Black,1)
      
      text_angle(a) = startangle+(deg_arc/2)
      
      startangle + deg_arc
  Next a
  
  
  SVG_Circle(cx,cy,r,-1) ; outline
  SVG_SetElementFill(#SVG_FillMode_None)
  SVG_SetElementStroke(#White,2,50) ;` this strokeopacity doesn't work!
  
  font = LoadFont(#PB_Any,fontname,fontsize)
  img = CreateImage(#PB_Any,1,1) : StartDrawing(ImageOutput(img))
  DrawingFont(FontID(font))
  cc.PointF : cc\x=cx : cc\y=cy
  For a = 1 To *p\slices
      txt.s = *p\slice[a]\name+" ("+Str(100/total**p\slice[a]\value)+"%)"
      tw.f = TextWidth(txt)
      DegreeCoordsFromPoint(@cc,text_angle(a),r/3*2,@tcc.PointF)
      SVG_Text(tcc\x-(tw/2),tcc\y,txt,#Black,"texel")
      SVG_SetElementFont(fontname,fontsize)
  Next a
  StopDrawing() : FreeImage(img) : FreeFont(font)
  
  
  SVG_StopDrawing()
  
  ProcedureReturn s
  
EndProcedure


p.PieChart
p\slices = Random(5)+Random(5)+5
For a = 1 To p\slices
    p\slice[a]\name = RandomLetters(5+Random(15))
    p\slice[a]\value = Random(50)+5
    p\slice[a]\color = RandomRGB(92,200)
Next a

s = SVGPieChart(@p,"Pies","A study")
If IsSVG(s)
    outputfile.s = previewfol+"PureSVG - pie.svg" : SaveSVG(s,outputfile,0) : RunProgram(outputfile)
EndIf
End
There are still some bugs. Here is my list:
  • Elements with minus coordinates are sometimes "pushed into" the canvas.
  • SVG_CircleSegment looks bad with radius of 180 degrees
  • Boundary checking doesn't work on paths that use bezier curves and elliptical arcs.
  • Stretching (resizing) a path that contains an elliptical arc will cause distortion of the arc.
  • You can't rotate text or image elements - I don't know if this will ever be solved.
JACK WEBB: "Coding in C is like sculpting a statue using only sandpaper. You can do it, but the result wouldn't be any better. So why bother? Just use the right tools and get the job done."
Seymour Clufley
Addict
Addict
Posts: 1233
Joined: Wed Feb 28, 2007 9:13 am
Location: London

Re: SVG "drawing"

Post by Seymour Clufley »

Sorry, but I've been meaning to reply to this for ages...
Rings wrote:What about writing a viewer (no , not a web-browser) or some routines to write the SVG to a image/sprite ourselves here ? Cannot be to different (except the scripting stuff) with only the primitives and gradients.....
I think this would actually be quite difficult. For a start you'd need code to handle bezier curves (cubic and quadratic) and elliptical arcs. And SVG filters would be very hard to emulate, though perhaps they could be ignored.

There is a program, RSVG, for rendering SVGs as raster files.
JACK WEBB: "Coding in C is like sculpting a statue using only sandpaper. You can do it, but the result wouldn't be any better. So why bother? Just use the right tools and get the job done."
peterb
User
User
Posts: 60
Joined: Sun Oct 02, 2005 8:55 am
Location: Czech Republic
Contact:

Re: PureSVG (updated 16/Jan/10)

Post by peterb »

SVG Gadget - Proof of concept

http://purebasic.peterbay.org/svg.zip
Seymour Clufley
Addict
Addict
Posts: 1233
Joined: Wed Feb 28, 2007 9:13 am
Location: London

Re: PureSVG (updated 27/Jan/10)

Post by Seymour Clufley »

New version!

There's a small number of new commands, such as SVGWeb(), SimplifyPath() and SetElementHREF().

Other than that, this version focuses on stability. Some bug fixes:
  • Element stroke is taken into account when calculating dimensions
  • SVG_CircleSegment can handle 180 degree radius.
  • Resizing and rotation can be done to polylines and polygons
  • Namespaces were not applied in the best way
  • Bound-checking of elliptical arcs now works (thanks to Ollivier!)
There are still bugs:
  • SetVisiblePortion() is not reliable and I'd recommend that you don't use it just now
  • Resizing a path that contains elliptical arcs will result in distortion
I'll be working on those bugs. If you find any others, please let me know.
JACK WEBB: "Coding in C is like sculpting a statue using only sandpaper. You can do it, but the result wouldn't be any better. So why bother? Just use the right tools and get the job done."
Post Reply