你有多小可以切片HTML5 Canvas像素?

时间:2011-05-03 06:01:35

标签: html5 canvas

在Flash中,像素是使用缇或二十分之一像素计算的。因此,每个位置总是0.05的倍数。我没有在HTML Canvas规范中看到过这个,并且无法在Canvas上跟踪光标位置。有谁知道像素计算的准确性?

编辑以澄清:

我更多地提到Zeno's paradox,为了将某些东西从A点移动到B点,它必须首先移动到两者之间的某一点。然后再次中途,无限期。

所以,如果我想在x轴上从0点移动到100,那么在0.5:

  1. 第1:50行
  2. 第2帧:75
  3. 第3帧:87.5
  4. 然后:93.75,96.875,98.4375 ......等等。
  5. 那么Canvas在什么步骤实际上围绕下一个像素呢?

1 个答案:

答案 0 :(得分:4)

我不确定切片的准确性是什么意思。

画布上的像素可以被绘制到略小于0.10,之后几乎不会产生任何明显的影响。

当然,如果缩放,可以绘制0.00125像素的内容,依此类推。但如果你不按比例缩放,它们将不可见。

http://jsfiddle.net/GvVD9/

(左上角的第一个方块是一个像素)

鼠标的准确性完全不同,与画布规格无关。

编辑:

好吧,我们可以分类证明这一点。我们可以绘制一组y值接近100的像素,看看它们与用y值100绘制的红色像素的比较。

http://jsfiddle.net/GvVD9/46/

使用drawRect命令,每个单独的水平分离的部分只是一个1 x 1像素的矩形。

50
75
87.5
93.75  // first black pixel you see in image
96.875
98.4375
99.21875
99.609375
99.8046875
99.90234375
99.951171875
99.9755859375
99.98779296875
99.993896484375
99.9969482421875 // last black pixel you see in image

enter image description here