examples from "svg essentials"

[joachimheintz]

as i am learning svg, and would like to use it with drawSvg, i started to convert the examples from david eisenberg's "svg essentials" to drawSvg code in my fork.
if you are interested in adding them to your examples, i can send you a pull request, after i finished.
for some topics i would need some help though. i am not really able to understand the details of your code. the examples are good, but too few. questions so far:

• how to use draw.DrawingDef (after some search i found an explanation here but still don't understand how to use it for other cases of the defs element.
• how to use draw.Raw.
• how to get the svg symbol element.

thanks for the great library -
joachim

[cduck]

Those examples look nice so far. They could make a good basis for additional documentation pages.

DrawingDef

DrawingDef is the parent class for any SVG element that may only be used as a child of the <defs></defs> tag.

Implement a new element of this type like this:

class MyCustomDef(DrawingDef):
    TAG_NAME = 'customDef'
    def __init__(self, ..., **kwargs):
        ...
        super().__init__(...=..., **kwargs)  # All arguments to super().__init__ become SVG attributes

Raw

Use draw.Raw to insert raw XML code directly into the output. If possible, you should prefer to subclass DrawingBasicElement, DrawingParentElement, or DrawingDef instead.

d.append(draw.Raw('''<someTag>...</someTag>'''))

Symbol and other elements not provided by drawSvg

If the SVG tag can contain child tags:

class Symbol(DrawingParentElement):
    TAG_NAME = 'symbol'
    def __init__(self, ..., **kwargs):
        ...
        super().__init__(...=..., **kwargs)  # All arguments to super().__init__ become SVG attributes

If the SVG tag will never contain child tags:

class MyCustomTag(DrawingBasicElement):
    TAG_NAME = 'customTag'
    def __init__(self, ..., **kwargs):
        ...
        super().__init__(...=..., **kwargs)  # All arguments to super().__init__ become SVG attributes

Using the above:

d = draw.Drawing(...)
sym1 = Symbol(...)
sym1.append(draw.Circle(0, 0, r))
d.append(draw.Use(sym1, x, y))
d.append(draw.Use(sym1, x2, y2))

my_parent_tag = MyParentTag(...)
my_parent_tag.append(draw.Circle(...))
d.append(my_parent_tag)
d.append(MyCustomTag(...))

Note: [The symbol tag] is an SVG 2.0 feature but drawSvg (and CairoSVG which is used for PNG output) primarily support SVG 1.1. Use draw.Group in the same way for full support:

d = draw.Drawing(...)
sym1 = draw.Group()
sym1.append(draw.Circle(0, 0, r))
d.append(draw.Use(sym1, x, y))
d.append(draw.Use(sym1, x2, y2))

[joachimheintz]

thanks very much for these explanations! more and more i get what you did with this library. i think it is very well done as it offers a big flexibility, also for future changes.
i have just completed a quick reference. it is here in two versions:

1. as notebooks in /quickref_nb
2. as quickref.md in /doc which is meant to be added to https://draw2svg.netlify.app/.
   during my work on the examples which i mentioned in this thread here, i more and more disagreed with your decision about changing the svg coordinates from top left to bottom left. so i used the draw2Svg fork instead.
   if you are interested in using my examples for any documentation, feel free to do so. perhaps after version 2 there will be no difference any more, as you announced.

[cduck]

Thanks for the feedback! I hope you check out the newly released version 2.

[joachimheintz]

ah that's great --- thanks for informing me. i did some documentation based on draw2Svg. i will update this, and send you a pull request. better to keep this all in one place. is there anywhere a simple example how to insert a statement in the SVG <defs> tag? this wold be very helpful. i know it should be done with draw.DrawingDef, but i don't understand how.

…

On 26/02/2023 10:46, Casey Duckering wrote: Thanks for the feedback! I hope you check out the newly released version 2. — Reply to this email directly, view it on GitHub <#83 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAQYHKW2GB5FOGLL5MPYZ23WZMQ6PANCNFSM6AAAAAATDCXBMY>. You are receiving this because you authored the thread.Message ID: ***@***.***>

[cduck]

Looks like there's no example for manually adding to defs with d.append_def(). It's usually automatic (through a reference like Circle(..., clip_path=ClipPath(...)) as shown in https://github.com/cduck/drawSvg#duplicate-geometry-and-clip-paths and the next example. DrawingDef just indicates an element type that is expected to always be in defs.