移动自定义字体不起作用

时间:2011-07-25 02:47:23

标签: javascript raphael

我正在尝试使用raphael的print()通过动画移动文本,但它不起作用:

var paper = Raphael(document.getElementById("stage"), 640, 480);
var text = paper.print(300, 200, "Test Text", paper.getFont("Yanone"), 50);
text.animate({
    y: 400
}, 1000);

任何人都有我可能缺少的想法吗?

1 个答案:

答案 0 :(得分:1)

如果您想稍后为其设置动画,我认为您应该使用text函数而不是print函数。我不确定为什么但它有效...

以下是两种方法的示例:

var paper = Raphael("canvas", 640, 480);
var fonts = [0, paper.getFont("DIN")];

//using print
var p = paper.print(70, 150, "Custom fonts", fonts[1], 20).attr({fill: "#f00"});

//using text (font-family is the same as in getFont)
var t = paper.text(100, 150, "Custom fonts")
t.attr({"font-family": "DIN", "font-size":50, "opacity": 0.5});
t.attr({"fill": "#000"});

在第二个上你可以这样做:

t.animate({"font-size":40,"fill":"#0f0"},2000);
t.animate({"x":150},5000);