textpath-selection.svg

Enable keyboard shortcuts

Checkerboard

<!--

     Any copyright is dedicated to the Public Domain.

     http://creativecommons.org/publicdomain/zero/1.0/

-->

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">

  <path id="p" d="M 100,100 h 50 v 200" fill="none" stroke="red" stroke-width="1"/>

  <text style="font: 30px monospace"><textPath xlink:href="#p">a.b.c.d.e.</textPath></text>

  <script>

    var textPath = document.getElementsByTagName("textPath")[0];

    var range = document.createRange();

    range.setStart(textPath.firstChild, 1);

    range.setEnd(textPath.firstChild, 9);

    window.getSelection().addRange(range);

  </script>

</svg>