html - 如何更改 html5 Canvas 的来源？

Question

我找不到 html5 canvas 的答案。我可以更改原点的坐标，以便我的图形将完全向右移动 15 像素(只是一个例子)。给定以下 html 和 css？

<canvas id="g" width="auto" height="auto">Your browser doesnt support canvas tag</canvas>

CSS:

canvas, section {
    display: block;
}    

#g {
    position: absolute;
    width:100%;
    height:100%;
    overflow:hidden; 
}

Answer 1

听起来你需要一个 translate transform .根据您对上下文所做的其他操作，您可能还需要调用 save() and restore() .

var ctx = document.getElementById('myCanvas').getContext('2d');
ctx.save();
ctx.translate(15, 0);
// ... do stuff with the transformed origin
ctx.restore();
// ... do stuff with the canvas restored to its original state (if necessary)