<script type="text/javascript">
window.onload = function () {
/** @type {HTMLCanvasElement} */
//1.获取画布
var canvas = document.querySelector('#test');
if (canvas.getContext) {
//2.获取画笔
var ctx = canvas.getContext('2d');
/* 移动 translate(x,y)
我们先介绍translate方法来移动canvas的原点到一个不同的位置
translate方法接受两个参数 x-左偏移量 y-右偏移量
*/
ctx.translate(50,50); //canvas中的是累加的
ctx.translate(50,50); //相当于写一条ctx.translate(100,100);
ctx.beginPath();
ctx.fillRect(0,0,100,100)
}
}
</script>
canvas-变换-translate(移动)
最新推荐文章于 2024-05-16 07:17:59 发布