我正试着用画布画一条二次曲线。代码如下:
HTML:
<canvas id="mycanvas">
Your browser is not supported.
</canvas>
JavaScript:
var canvas = document.getElementById("mycanvas");
canvas.style.width = "1000px";
canvas.style.height = "1000px";
if (canvas.getContext) {
var ctx = canvas.getContext("2d");
var x = 0,
y = 0;
setInterval(function() {
ctx.lineTo(x, y);
ctx.stroke();
x += 1;
y = 0.01 * x * x;
}, 100);
}
但是结果真的很难看,第一,线条太粗,第二,别名太明显了……我该如何改进它呢?
你可以在这里看到效果:http://jsfiddle.net/7wNmx/1/
发布于 2011-05-17 22:31:18
您要做的是创建一个默认大小为300 x 150的画布,然后使用CSS将其放大到1000px x 1000px。但是像这样放大它只会放大像素的大小,而不会增加画布本身的分辨率。您需要做的是使用width
和height
属性设置画布本身的实际尺寸:
<canvas width="1000" height="1000" id="mycanvas">
Your browser is not supported.
</canvas>
这样你就不再需要通过设置canvas.style.width
和height
来扩展它了。
https://stackoverflow.com/questions/6032263
复制相似问题