Last modified: 2006-10-27 12:07:14 UTC
I must say in some ways wiki SVG engine is better then Firefox's and even Opera's (at least 8.0)... However there is a big issue of positioning the text. I don't know why, but the text gets put only on some fixed positions like it would be attached to some grid. Someone made this test image with Inkscape: http://test.wikipedia.org/wiki/Image:Test.svg I made a simplified test here: http://test.wikipedia.org/wiki/Image:Text_positioning_test.svg You may see the above in Opera Browser to get the idea of what it should look like. Generally the idea was to render all 3 as O<sub>2</sub>. Please look into the code of SVG to see what is done there. Issues: 1. The baseline of text is not (vertically) aligned to the given coordinates. 2. Only transform attribute gives the possibility to move text freely. Document on text elements in SVG (just for reference): http://www.w3.org/TR/SVG/text.html
I don't know how this is done, but I have a genaerall idea of how to quickly solve this. 1. Render text to 0,0 cords. 2. Translate the _picture_ to the cords given by computed values. By computed I mean from all dependecies that it is done now plus from dx,dy in some next version.
OK. There is a hack for this one, so I say it works for me ;). The problem is that if one makes a picture so small that has to use fonts like 1px size or something like that, then it won't work. The simplest solution is to multiply all text position and width values by 10 or 100 (pretty easy to recalculate by hand). All other elements should scaled by the same value which might be done by hand or they could be grouped and scaled like this: <g transform="scale(10)"> non-text elements here </g> viewBox also has to be change (multiplying it's values by the same value) For a hack in works see new version of: http://test.wikipedia.org/wiki/Image:Text_positioning_test.svg (resizing whole SVG to 400x240 was only for fitting the test picture in my screen and not really an issue here, viewBox also has to be changed)