我看过像Cufon和typeface.js这样的东西,但它们似乎是SIFR替代品,不允许你设置自由形式坐标并将自定义类型绘制到 <canvas>
有人有任何想法吗？
Google的Web Fonts API提供了一种定义回调函数的方法,如果字体加载完毕或无法加载等等,是否可以使用CSS3 Web字体(@ font-face)实现类似的功能？
我完全不知道如何在画布上绘制文本时更改我正在使用的字体.以下是我在CSS中定义的字体:
@font-face{
font-family:"Officina";
src:url(OfficinaSansStd-Book.otf);
}
现在在我的HTML/JavaScript中,我很想说:
context.font = '30px "Officina"';
但这不起作用.如果我使用网络可用字体(如Arial),它工作正常,当我直接将纯文本写入网页时,Officina字体显示正常.我错过了什么？
我正在尝试将事件处理程序附加到链接标记的加载事件,以在加载样式表后执行某些代码.
new_element = document.createElement('link');
new_element.type = 'text/css';
new_element.rel = 'stylesheet';
new_element.href = 'http://domain.tld/file.css';
new_element.addEventListener('load', function() { alert('foo'); }, false);
document.getElementsByTagName('head')[0].appendChild(new_element)
我也试过onreadystatechange
new_element.onreadystatechange = function() { alert('foo'); }
不幸的是,这两种方法都没有导致触发警报.此外,在使用addEventListener注册'load'事件的处理程序后,new_element.onload为null.这是正常的吗？
谢谢,安德鲁
ps:我可能不会使用任何框架来解决这个问题
我使用以下代码使用canvas编写文本.
<html>
<head>
<script type="text/javascript">
function convert(){
draw(document.getElementById('canvas').getContext('2d'));
}
function draw(txt){
var fillText="Some text";
txt.textBaseline="top";
txt.font="Arial";
txt.fillStyle="red";
txt.fillText(fillText,20,20);
}
</script>
</head>
<body onload="convert()">
<canvas id="canvas"></canvas>
</body>
</html>
我的问题是:是否有可能用其他语言写文字？