如何在RaphaelJS中设置文本字体

Question

我有一个小的RaphaelJS脚本,它使用Text在屏幕上显示文本.此文本是动态的 - 它经常更新.

我想设置文本的字体.我已经下载了我喜欢的Cufon .js字体文件,并使用下面的代码来设置字体.除了,它不起作用!

...整个字体都没有变化.设置颜色,以及字体大小,位置等.但不是实际的字体本身.

如果我打印文本而不是使用文本字体工作正常.但我不想这样做 - 它需要是动态的.

var text = paper.text(200,245,"--:--");

var paper = new Raphael( 0, 0, 600, 400) ;
var font = paper.getFont("FontName");
text.attr({ "font-size": 25, font: "FontName", "font-weight": 400, fill: lcdDisplayColour });

function updateText()
{
    /**
    .
    .
    .
    **/

    var newText = "some new text";
    text.attr({text: ""+dClockText});

}

在HTML文件中我有:

<script src="raphael-min.js" type="text/javascript"></script>
<script src="nameOfCufonFile.js" type="text/javascript"></script>
<script src="myScript.js" type="text/javascript"></script>

我也尝试过:

text.attr({ "font-size": 25, font: font, ...
text.attr({ "font-size": 25, "font-family": "FontName", ...
text.attr({ "font-size": 25, "font-family": font, ...

Answer 1

像这样的东西应该工作正常:

text.attr({ "font-size": 25, "font-family": "fontName, sans-serif" });

也许你在css中有一些关于字体的规则,这是否超越它？

或者你的字体可能有问题,试试这个:

<link href='http://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>

然后设置font-family:

"font-family": "Pacifico" 

这对你有用吗？

BTW.Cufon字体适用于Raphael.print()方法,不适用于Raphael.text().