Raphael JS和Text定位？

Question

我试图通过提供x,y坐标来在SVG画布中定位文本

var t = paper.text(50, 50, "Raphaël\nkicks\nbutt!");

但不会像所有其他对象一样定位文本......

x,y坐标指定对象的中心!不是"左上角"像素!

---

我希望沿着一条线"左对齐"文本,与标准HTML相同.

非常感谢帮助.

Answer 1

默认情况下,text方法的Text-anchor属性设置为"middle".

如果要左对齐它,请在对象的属性中更改text-anchor:

var t = paper.text(50, 50, "Raphaël\nkicks\nbutt!").attr({'text-anchor': 'start'});

Answer 2

我知道你没有说你需要将它垂直对齐到顶部,但是如果你想使用paper.text而不是paper.print ...并希望垂直对齐到顶部.

试试这个:

function alignTop(t) {
    var b = t.getBBox();
    var h = Math.abs(b.y2) - Math.abs(b.y) + 1;

    t.attr({
        'y': b.y + h
    });
}

然后将Raphael文本对象传递给它.它将为您排列最佳位置.并只是调用该功能

Answer 3

解决!

通过使用以下

paper.print(100, 100, "Test string", paper.getFont("Times", 800), 30);

它现在对齐左边的文字.