相关疑难解决方法(0)

使用@ font-face将文本绘制到<canvas>在第一次时不起作用

当我在带有通过@ font-face加载的字体的画布上绘制文本时,文本无法正确显示.它根本不显示(在Chrome 13和Firefox 5中),或者字体错误(Opera 11).此类意外行为仅在第一次使用字体绘图时发生.之后一切正常.

这是标准行为还是什么?

谢谢.

PS:以下是测试用例的源代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>@font-face and &lt;canvas&gt;</title>
        <style id="css">
@font-face {
    font-family: 'Press Start 2P';
    src: url('fonts/PressStart2P.ttf');
}
        </style>
        <style>
canvas, pre {
    border: 1px solid black;
    padding: 0 1em;
}
        </style>
    </head>
    <body>
        <h1>@font-face and &lt;canvas&gt;</h1>
        <p>
            Description: click the button several times, and you will see the problem.
            The first line won't show at all, or with a wrong typeface even if it does.
            <strong>If you have visited …
Run Code Online (Sandbox Code Playgroud)

html5 canvas font-face

85
推荐指数
6
解决办法
7万
查看次数

是否可以向图表js添加自定义字体?

我想在Chart JS中使用外部字体.有谁知道这是否可能?我通过文档搜索过,但我还没有找到解决方案.

javascript chart.js

5
推荐指数
1
解决办法
3343
查看次数

如何轻松地将自定义字体放入HTML5 Canvas?

在查看问题时,我从未找到对上述内容的明确答案.我想要一种适用于几乎所有平台的方法.所以为了社区的利益,我想我会分享我在使用自定义字体在画布上工作的成功.我的主要问题是,什么是让所述字体工作的万无一失的方法?我尝试了多种方法,比如只使用CSS样式表,但它比这复杂一点.这是我发现的:

javascript css html5 canvas

3
推荐指数
2
解决办法
4441
查看次数

预装字体HTML5,JS,Kinetic.js?

我有一个自定义字体(*.ttf),我用来在HTML画布上使用Kinetic.js编写文本.

不幸的是,在第一次加载页面时,它没有使用我的自定义字体,重新加载页面时一切都很好.

我可以以某种方式预加载字体吗?

我试过这个,但仍然没有工作:

<link rel="prefetch" href="resource/font/IDAutomationHC39M.ttf">
Run Code Online (Sandbox Code Playgroud)

我可以告诉Kinetic.js以某种方式预加载吗?

字体在我的CSS中定义如下:

@font-face {
    font-family: "Barcode";
    src: url(../font/IDAutomationHC39M.ttf);
}
Run Code Online (Sandbox Code Playgroud)

在此先感谢您的支持!

html fonts canvas kineticjs

2
推荐指数
2
解决办法
8119
查看次数

标签 统计

canvas ×3

html5 ×2

javascript ×2

chart.js ×1

css ×1

font-face ×1

fonts ×1

html ×1

kineticjs ×1