如何在 RaphaelJS 中设置文本字体
How to set Text font in RaphaelJS
我有一个小的 RaphaelJS 脚本,它使用 Text 在屏幕上显示文本。此文本是动态的 - 它经常更新。
我想设置文字的字体。我已经根据自己的喜好下载了一个 Cufon .js 字体文件,并使用下面的代码来设置字体。 除了,不行!
...字体始终不变。设置了颜色,以及字体大小、位置等。但不是实际的字体本身。
如果我 打印 文本而不是使用 Text,则字体可以正常工作。 但我不想那样做 - 它需要是动态的。
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, ...
像这样的东西应该可以正常工作:
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": "Pacifico"
这对你有用吗?
顺便说一句。 Cufon 字体适用于 Raphael.print() 方法,不适用于 Raphael.text().
我有一个小的 RaphaelJS 脚本,它使用 Text 在屏幕上显示文本。此文本是动态的 - 它经常更新。
我想设置文字的字体。我已经根据自己的喜好下载了一个 Cufon .js 字体文件,并使用下面的代码来设置字体。 除了,不行!
...字体始终不变。设置了颜色,以及字体大小、位置等。但不是实际的字体本身。
如果我 打印 文本而不是使用 Text,则字体可以正常工作。 但我不想那样做 - 它需要是动态的。
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, ...
像这样的东西应该可以正常工作:
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": "Pacifico"
这对你有用吗?
顺便说一句。 Cufon 字体适用于 Raphael.print() 方法,不适用于 Raphael.text().