How does the path tag work?

Question

<path d=' M 0 0 L200 200 L200 0 Z'>
This is supposed to make a right angled triangle but I am failing to understand how it works.
Does the value of the d attribute contain the coordinates that automatically connect to each other or are they commands controlling a 'pen'.

Answer 1

Much more like "commands controlling a pen"... and describe a curve by parts (simplest curve is straight line segment).

In the example provided:
M 0 0 move the 'pen' to coordinate 0 0
L 200 200 draw a line from pen position to absolute coordinate 200 200
L 200 0 another line from last point to 200 0
Z close the path (line from last point to first one)

More on available 'commands' at:
https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths

But usually, complex path are not done manually, but through the help of a vector drawing software ;)

Answer 2

visph Thank you so much I understand now