Question

我找到了这个jsperf，它清楚地显示了与fillText相比drawImage的速度有多快：

http://jsperf.com/image-vs-text

但是如果你希望你的文字是动态的，如何实际实现呢？它认为您需要一个包含所需字母和数字的图像，然后根据给定的字符串部分绘制它。

有人可以举例说明这实际上是如何运作的吗？当你尽可能少地现场直播文字时，我读到它会大大加快你的应用程序......

Answer 1

嗯，javacript有一些图像，但我试过的最好的是插图画家插件。

DrawScript

例如，这将生成J：

的代码

lineStyle="rgb(0,0,0)";
lineWidth=1;
beginPath();
moveTo(223,179);
bezierCurveTo(292,187,361,185,430,192);
bezierCurveTo(474,196,522,203,566,196);
bezierCurveTo(587,192,606,182,627,179);
bezierCurveTo(627,198,611,220,606,238);
bezierCurveTo(595,284,590,330,577,376);
bezierCurveTo(566,419,554,462,542,506);
bezierCurveTo(534,544,530,589,514,625);
bezierCurveTo(487,682,392,696,334,695);
bezierCurveTo(206,689,142,577,179,460);
stroke();

它对于小写字母或需要看起来特别的东西很安静。和@font face不是一个选项

如何用drawImage绘制字母（以避免slow strokeText / fillText）？

1 个答案: