[英]How to Add Custom Coordinate For HTML5 Canvas
您能否看一下此演示,并让我知道如何将画布的起点设置为0,0到500,1200? 例如,如果我有一个坐标为583,1642的点,则可以将点添加为:
ctx.arc(583,1642,5,0,Math.PI * 2,true);
$("#draw").on("click", function () {
var ctx = $('#canvas')[0].getContext("2d");
ctx.fillStyle = "#00A308";
ctx.beginPath();
ctx.arc(0, 0, 5, 0, Math.PI * 2, true);
ctx.arc(75, 75, 5, 0, Math.PI * 2, true);
ctx.arc(300, 300, 5, 0, Math.PI * 2, true);
ctx.closePath();
ctx.fill();
});
谢谢,
您可以使用平移来移动坐标系。 只需将其反向移动即可,例如:
ctx.translate(-500, -1200);
现在,当您在583、1642处绘制某个东西时,它将相对于视口显示在83、442处。
要重置,只需变换回去或使用单位矩阵初始化即可:
ctx.setTransform(1, 0, 0, 1, 0, 0);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.