具体情况,webfont或位图

时间:2013-08-20 21:08:04

标签: html5 canvas fonts font-face cufon

我正在制作一个html5画布应用程序,我将使用像素艺术字体,它将始终具有相同的大小(可能是移动设备的额外大小)。我只需要大写,一些基本的标点和数字,总共50个符号。

我尝试使用cufon http://cufon.shoqolate.com/generate/转换此字体,但它的扩展非常糟糕。它变得非常模糊或扭曲。它最终会做,但它并不完美。

所以我在思考,因为我正在使用画布,如果我应该只使用带有所有字母和符号的spritesheet,因为在我的情况下它们的数量很少,并且制作一个只显示每个字符串的脚本使用那些字母精灵在屏幕上显示文字。

这种解决方案会不会对性能造成太大影响?

我还在考虑是否可以更改字体的默认大小。我注意到,每种字体都有一定大小,不适用于网络,它可以在网络浏览器中完美显示。当我调整大小时,它开始扭曲。有可能以某种方式改变它吗?

1 个答案:

答案 0 :(得分:0)

如果您想要无失真缩放,请将字体转换为SVG。

普通字体是光栅图形......由固定像素组成,可以很好地缩放。

SVG是矢量绘图......由线条+曲线组成,可以很好地缩放。

您可以直接在浏览器中使用SVG字体,但Firefox和IE除外。

对于这两个浏览器,您将需要学习一些关于在文档中嵌入SVG的知识 - 这并不难。您可以构建一个使用SVG字形数据构建文本输出的文本工厂。

这是一个将TTF字体转换为SVG字形的网站:

http://www.freefontconverter.com/

祝你的项目好运!