Home/ Questions/Q 6841175
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T23:56:04+00:00

I am using Raphael’s JavaScript library (http://raphaeljs.com/) to draw some graphics into my web-application.

  • 0

I am using Raphael’s JavaScript library (http://raphaeljs.com/) to draw some graphics into my web-application. I tried the following code:

<html>
<head>
    <title></title>
    <script type="text/javascript" src="raphael/raphael.js"></script>
</head>
<body>    
    <script>
        var paper = Raphael(10, 50, 600, 200);            
        paper.text(300, 50, "first very very long line\nshort line").attr(
            {"font-family":"arial", 
            "font-size":"30",
            "text-align":"left"}
            );
    </script>
</body>
</html>

The result is a graphic with two lines of text that are centered. The css font-family and font-size are displayed correct. But the css text-align is ignored. Why?

(tested with Firefox 8.0 and Chrome 15)

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    It seems that Raphael doesn’t use text-align property. Instead use the text-anchor property, its possible values are start, middle, end or inherit.

    In your example use it like this:

    paper.text(300, 50, "first very very long line\nshort line").attr({
    "font-family":"arial", 
    "font-size":"30",
    "text-anchor":"start"
});
    • 0