Geek asks and answers

JQuery SVG nested groups

I need to generate an SVG nested group using jQuerySVG or RaphaëlJS. The latter does not support groups, so I chose the first.

What I need:

<g transform="translate(300, 300)">
    <line x1="0" y1="0" x2="0" y2="-100" />
    <g transform="translate(0, -100) rotate(20)">
        <line x1="0" y1="0" x2="0" y2="-100" />
    </g>
</g>

The site is currently down, but checking the web archive for documentation, I can’t find a way to provide the element with two different groups:

svg.line(g, 10, 80, 140, 70);

I am looking for something like:

svg.line(g, g2, 10, 80, 140, 70);

Any other approach?

thank

+3
source share
1 answer

According to the document, you can do this:

g = svg.group();
g2 = svg.group(g);
svg.line(g, 10, 80, 140, 70);
svg.line(g2, 10, 80, 140, 70);
+2
source

More articles:


All Articles