PureBasic Forums - English

Posted: **Tue Jan 05, 2010 2:45 am**

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.

Posted: **Tue Jan 05, 2010 2:51 am**

EDIT: this post was a kind of "help file". We don't need it anymore.

Posted: **Tue Jan 05, 2010 11:38 am**

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.

Thanks again.

Posted: **Tue Jan 05, 2010 11:44 am**

I like SVGs, I really do, but Windows never seems to like them - does anyone have a suggestion for a good windows SVG viewer?

Posted: **Tue Jan 05, 2010 2:17 pm**

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.

Posted: **Wed Jan 06, 2010 9:32 am**

thanks looks really interesting, just wish I had the time to look at it right now.

Posted: **Wed Jan 06, 2010 10:39 am**

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.....

Posted: **Wed Jan 06, 2010 1:21 pm**

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?

Posted: **Wed Jan 06, 2010 1:43 pm**

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)

Posted: **Thu Jan 07, 2010 1:22 am**

@Seymour:
Nice job! Thanks for sharing.

@Dige
Tested successfully with Pb 4.40 & Win7, replacing the missing R() for MessageRequester.

Posted: **Thu Jan 07, 2010 2:16 pm**

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()

Posted: **Sat Jan 16, 2010 7:10 pm**

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.

Posted: **Sun Jan 17, 2010 3:08 am**

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.

Posted: **Sun Jan 17, 2010 6:31 pm**

SVG Gadget - Proof of concept

http://purebasic.peterbay.org/svg.zip

Posted: **Thu Jan 28, 2010 1:42 am**

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.

PureBasic Forums - English

PureSVG - now with LoadSVG() !

PureSVG - now with LoadSVG() !

Re: SVG "drawing"

Re: SVG "drawing"

Re: SVG "drawing"

Re: SVG "drawing"

Re: SVG "drawing"

Re: SVG "drawing"

Re: SVG "drawing"

Re: SVG "drawing"

Re: SVG "drawing"

Re: SVG "drawing" (IMPROVED!)

Re: PureSVG (updated 16/Jan/10)

Re: SVG "drawing"

Re: PureSVG (updated 16/Jan/10)

Re: PureSVG (updated 27/Jan/10)