Set X and Y value for g element of SVG

Question

I am relatively new in SVG drawing with HTML5.

What I want to do is to make a group of elements in SVG with g element so that all e

Answer 1

elements don't support x or y attributes. You can use a transform instead though.

I've decreased the values from 1000 to 100 as otherwise the output is outside the 500 x 300 canvas of the outer element.

I've provided additional x and y attributes on the text element so it appears positioned as in your example. If wanted you could put the text itself in a element or an element.

or using an additional element to avoid x and y on the text itself.

Alternatively you could use an inner element instead of a element as that does support x and y attributes