in Raphael JS

Question

I need to do something like:

paper.text(Left, Top, " " + this._p.Label + ":");
paper.text(Left, Top, " " + this._p.Label + ":");

But the prepended whitespace won't show or show as   in text.

I've tried:

label.attr({"xml:space": "preserve"});

...with no effect.

Is there anyway to access the SVG node in Raphael JS so I can set

setAttributeNS("http://www.w3.org/XML/1998/namespace","space","preserve");

(or is there any other way to solve this?)

Answer 1

Yes, you can definitely apply that namespaced attribute directly to the SVG element managed by Raphael. It's this simple:

paper.canvas.setAttributeNS("http://www.w3.org/XML/1998/namespace", "xml:space","preserve");

Demonstrated to be functional here.

Answer 2

Although this seems somewhat ^[1] solved, I came across this discussion about the same issue, which rather suggests replacing spaces with \u00a0. This can easily be achieved by using the string function .replace(/ /g,'\u00a0').

---

¹ The leading spaces of the text node in the given link does not work for Mac Safari v.6.0.5. I'm not sure how it looks in other browsers and OS'es.