Fri, 16 Jan 2015 18:13:44 +0100
Integrate suggestion from review to improve consistency with existing code.
1 <!--
2 Any copyright is dedicated to the Public Domain.
3 http://creativecommons.org/publicdomain/zero/1.0/
4 -->
5 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
6 <path id="p" d="M 100,100 h 50 v 200" fill="none" stroke="red" stroke-width="1"/>
7 <g style="font: 30px monospace">
8 <text x="100" y="100">a</text>
9 </g>
10 <script><![CDATA[
11 function put(s, x, y, r) {
12 var e = document.createElementNS("http://www.w3.org/2000/svg", "text");
13 e.setAttribute("x", x);
14 e.setAttribute("y", y);
15 e.setAttribute("rotate", r);
16 e.textContent = s;
17 g.appendChild(e);
18 }
20 var s = "a.b.c.d.e.";
21 var text = document.getElementsByTagName("text")[0];
22 var g = text.parentNode;
23 var adv = text.getSubStringLength(0, 1);
24 for (var i = 1; i < s.length; i++) {
25 var x = i * adv;
26 if (x + adv / 2 < 50) {
27 put(s[i], 100 + x, 100, 0);
28 } else {
29 put(s[i], 150, 50 + x, 90);
30 }
31 }
32 ]]></script>
33 </svg>