I have a HTML5-canvas and write text with context.fillText(...);
using a @font-face-font.
Displaying the page with Firefox (3.6) I have the problem, that on the first paint of the canvas the font is not downloaded yet so the text will be displayed with a standard-font.
I found a 'solution' here but it does not work, because the font is only used in the canvas and the canvas is loaded and displayed with ajax using jQuery.
Is there any better solution than trying to use a timeout setTimeout(repaintCanvas, 500);
?
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效,请关闭广告屏蔽插件后再试):
问题:
回答1:
well, you could try this,
$.get('font/url.ttf',function(){
// do canvas codes.... cause font is loaded...
});
回答2:
I think I found a solution with the help of Reigel's answer:
$.get('font/url.ttf', function() {
// do canvas codes.... cause font is loaded...
});
Additionally use the font via font-family: 'fontfacename';
for the canvas' parent-element.
Could be that the font is loaded twice, don't know. But without the second load it won't be displayed right.