为什么写入Canvas的文本在两次写入同一位置时会变暗？

Question

当文本被多次写入相同位置时会变暗。为什么？

var txt = "The cat is on the mat";
var ctx = c.getContext("2d");   
ctx.font = "15px Lucida Sans Unicode";
ctx.fillText(txt,10,50);
ctx.fillText(txt,10,50);     // again
ctx.fillText(txt,10,100);

Answer 1

文本的边缘是消除锯齿的，这意味着它们与背景混合在一起。当您在更多文本的顶部放置文本时，它会与其后面的文本的消除锯齿边缘混合，使其看起来有别名和更大（因此更暗）。想想两块烟熏玻璃在彼此面前。