I'm trying to append ➤ into SVG using unicode as seen below.

g.append("text")
        .attr("x", 10)
        .attr("y", 10)
        .text("➤");

➤ is displayed, but not ➤

I'm trying to append ➤ into SVG using unicode as seen below.

g.append("text")
        .attr("x", 10)
        .attr("y", 10)
        .text("➤");

➤ is displayed, but not ➤

• javascript
• d3.js
• svg
• unicode

2 Answers 2

Instead of using .text() use .html()

➤ is HTML/XML markup. You're not inserting into HTML/XML source code, so these escapes don't do anything. You can just do:

.text('➤');

And save the file in the same encoding the browser will be reading it as (typically, UTF-8, for a page with <meta charset="utf-8"/>.

If you really can't use non-ASCII characters—eg because your script needs to be included from multiple pages with different character sets, or because your text editor doesn't support Unicode—then the type of escape you want to use is JavaScript string literal encoding. ➤ is U+27A4 Black Rightwards Arrowhead, so:

.text('\u27A4');