Group elements in svg output ?
lazarus / 54-FPvectorial

----------------------------------------------------------------------
BobT · 2020-10-23 21:21

Using fpvectorial, is it possible to generate an svg document / file
with grouped elements ? My immediate goal is to be able to group
simple rectangle shapes each with their own text element as a label,
but a general solution capable of deeper levels of groupiing would
have other uses as well.

----------------------------------------------------------------------
wp · 2020-10-27 12:07

There is an AddLayer command which, for svg, is written as a new <g>
node, i.e. groups the added elements. You must call SetCurrentLayer to
activate the new layer, or combine both in AddLayerAndSetAsCurrent.
ClearLayerselection returns to the first layer.

The following code
Code: Pascal  [Select][+][-]window.onload = function(){var x1 =
document.getElementById("main_content_section"); if (x1) { var x =
document.getElementsByClassName("geshi");for (var i = 0; i program
fpvwritegroup; {$mode objfpc}{$H+} uses  fpimage, fpCanvas, 
fpvectorial, svgvectorialwriter, fpvutils, fpvectorialpkg; const 
cFormat = vfSVG;  cExtension = '.svg';var  Vec: TvVectorialDocument; 
Page: TvVectorialPage;begin  Vec := TvVectorialDocument.Create;  try 
 // All documents are 10cm x 10cm    Vec.Width := 100;    Vec.Height
:= 100;    Page := Vec.AddPage();     Page.Clear;     with
Page.AddCircle(0, 0, 10) do    begin      Brush.Color := colYellow;  
  Brush.Style := bsSolid;    end;    
Page.AddLayerAndSetAsCurrent('g1');    with Page.AddCircle(50, 50, 10)
do    begin      Brush.Color := colRed;      Brush.Style := bsSolid; 
 end;    with Page.AddCircle(55, 50, 10) do    begin      Brush.Color
:= colGreen;      Brush.Style := bsSolid;    end;    
Page.ClearLayerSelection;    with Page.AddCircle(100, 100, 10) do   
begin      Brush.Color := colBlue;      Brush.Style := bsSolid;   
end;     Vec.WriteToFile('layer_demo' + cExtension, cFormat);  
finally    Vec.Free;  end;end.     
creates a file showing the <g> nodes as expected:

Quote  <g id="layer1">
  <circle cx="0" cy="354.32999999999998" r="35.433"
style="stroke:#000000; stroke-width:1px; stroke-linecap:butt; stroke-
linejoin:miter; stroke-opacity:1; fill:#FFFF00;" />
  <g id="layer2">
  <circle cx="177.16499999999999" cy="177.16499999999999" r="35.433"
style="stroke:#000000; stroke-width:1px; stroke-linecap:butt; stroke-
linejoin:miter; stroke-opacity:1; fill:#FF0000;" />
  <circle cx="194.88149999999999" cy="177.16499999999999" r="35.433"
style="stroke:#000000; stroke-width:1px; stroke-linecap:butt; stroke-
linejoin:miter; stroke-opacity:1; fill:#00FF00;" />
  </g>
  <circle cx="354.32999999999998" cy="0" r="35.433"
style="stroke:#000000; stroke-width:1px; stroke-linecap:butt; stroke-
linejoin:miter; stroke-opacity:1; fill:#0000FF;" />
  </g>

----------------------------------------------------------------------
BobT · 2020-11-23 19:04

Thanks wp. I'd fixed my ideas around the Inkscape 'layers' concept and
missed that the fpvectorial 'layer' is +-what Inkscape calls a group.