Skip to content
SVG (Scalable Vector Graphics) is a scheme for expressing graphics in XML (Extensible Markup Language). SVG is viewable in HTML 5 enabled browsers, which includes recent versions of most popular browsers.
In SGV, the origin (0,0) is in the upper left corner. The positive direction of the y-axis (vertical axis) is down. Angles are measured clockwise. Roots of this system go back to early days of computing. But this will almost certain be challenging to those familiar with the usual mathematical system.
It is relatively easy to make things somewhat easier for the user (person writing SGV markup). The origin can be moved to any convenient place by translation, and the the positive direction of y can be reversed by scaling it with -1. These changes can be set once and thereafter the user can write in the co-ordinates he likes. (Scaling can also make the units something other than pixels.) But I have not found a fix for angles.
All three of these figures are created with the same markup (except for color name. The native axes are shown in silver. The axes translated by 40 pixels in both directions are shown in blue. The black axes are translated even farther down and left and the y-axis is scaled with -1. Unfortunately, the text 0 does not do as I would like under scaling. Red shows the text scaled again with the position adjusted. The moral of this story seems to be, learn to work with the SVG canvas as it is.
The best way to look for anything in LarsWiki is to use the search bar.