It is difficult to talk about coordinates in a vacuum so here are two SVG drawing elements: text and rect.
The rect element has a large number of attributes but we shall consider just a few for the moment:
<rect x="20" y="30" width="300" height="200" rx="10" ry="10" style="fill:yellow;stroke:black" /> <text x="40" y="130" style="fill:green;stroke:none">Abracadabra</text>
The first two attributes, x and y, of the rect element define the origin of the rectangle. The second two define its width and height. The rx and ry attributes define the radius to be used in rounding the corners. Finally, the style attribute defines its rendering.
For the text element, the first two attributes, x and y, define the origin of the text string while the third attribute defines the rendering.
Please notice that the Y-axis in SVG points downwards. This can be a source of error when defining SVG diagrams so take extra care to remember this fact! The X-axis does go from left to right. The origin of the text by default is at the left-hand end of the text on the baseline. The font used is at the choice of the browser if unspecified.