Question

我最近扩展了可爱的jquery“flot”图表插件...目标是在图表上直接绘制图例中通常会出现的内容。

它看起来只是有点垃圾，因为IE似乎很难渲染字体。

看到这里，左边是IE，右边是Firefox：

btw ...绘制使用的文本的函数是fillText（）

我怎样才能让IE成型？

谢谢！

Answer 1

可悲的事实是，截至目前，Canvas中存在所有浏览器之间的字体差异。在Firefox中看起来单向的方式将在IE中看起来另一种方式。在Chrome中看起来单向的方式在Safari中看起来是另一种方式（即使它们都是基于webkit的）

将字体更改为“更安全”的字体，看看会发生什么。例如：

ctx.font = "72pt verdana"
ctx.fillText("lalalala", 0, 72);

应该在IE9和FF4中呈现相同的内容。

当然，这不是最后一次。如果您正在进行缩放和旋转字体等操作，您甚至会遇到更棘手的问题。在Opera或Chrome的非开发版本中尝试此操作：http://simonsarris.com/misc/scaleText.html

因此，解决方案是在您想要定位的浏览器上找到最终看起来相同的字体（通过反复试验，从Web安全字体列表开始），并尝试不要同时扩展和在调用fillText之前旋转画布。甚至可能有其他转换会在不同的浏览器中产生奇怪的效果，所以你应该在一个简单的情况下尝试你的字体，看它是否真的看起来不同。