小编akb*_*kbr的帖子

Chrome会在canvas元素上以不同方式转换文本.为什么?

似乎Chrome强制在canvas元素顶部的文本上进行硬件加速转换.

任何人都可以帮我理解这种行为吗?最终,我想在没有将文本转换为纹理的情况下在canvas元素上缩放文本.

这个小提琴显示了这个问题:http://jsfiddle.net/Gb6h4/1/

这是代码:

// Get a reference to the canvas and its context
var $canvas = $("canvas");
var ctx = $canvas[0].getContext('2d');

// Make the canvas fullscreen
var width = $(window).width(),
    height = $(window).height();
$canvas.attr({
    width: width,
    height: height
});

// In Chrome, modifying the canvas context in any way
// seems to force a hardware-accelerated transform
// on the text.
// (The text is scaled as a texture, becoming blurrier.)

// Uncomment the line …
Run Code Online (Sandbox Code Playgroud)

html javascript css canvas transform

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

标签 统计

canvas ×1

css ×1

html ×1

javascript ×1

transform ×1