我想知道为什么垂直线条(笔画)正在减慢颜色的变化,几乎就像它们朝着末端倾斜一样
以下是我的意思,即使用HTML5 Canvas
感谢您的帮助
艾登
答案 0 :(得分:1)
代码的问题在于,每次在路径中添加一行时都会进行描边。
你的线条有点薄。低于1的值有效 - 这将激活子像素(非整数坐标)。
褪色是先前线条相互重叠的结果。因为它们是亚像素的,所以它会产生“褪色”效果,因为较旧的线条具有比新线条更“混合”的信息,这使得它们在外观上“更强”。
尝试此修改:(http://jsfiddle.net/YyhxV/2/)
//...
context.lineWidth= 0.2; //0.1 is a bit too thin, try cranking it up a bit
//...
for(var interval = 0; interval < 24; interval++)
{
context.moveTo(interval*spacing+0.5,50);
context.lineTo(interval*spacing+0.5,42);
}
//move stroke outside
context.stroke();