我在一个div中有2个画布。我试图翻译其中一个画布，但它没有工作。
http://jsfiddle.net/VkbV5/显示了我注释掉翻译行的情况:
this.innerElement2Ctx.translate(100,100);
但是当我加入这条线时，小正方形消失了。为什么?如果您在浏览器中运行此页面并检查innerElement2，您将看到它根本没有移动，但是小正方形消失了。
对于您的信息，我需要2画布，因为我计划将鼠标事件附加到innerElement2.
翻译上下文调整0,0点的位置，以便将来绘制命令;缩放上下文调整画布上绘制的项目的大小;旋转上下文可调整项目绘制的方向。这些上下文转换都不会调整画布框本身的大小或位置。
下面是我做的一个调整画布转换的例子，这样绘制相同的命令允许用户在画布上缩放和平移:
http://phrogz.net/tmp/canvas_zoom_to_cursor.html
如果你想在HTML页面中移动画布的位置，使用简单的CSS位置，就像你对任何其他元素一样，例如<div>。
如果你想要复杂的2D或3D转换，你可以使用CSS的尖端功能来实现这一点(现代浏览器支持)。例如:
https://developer.mozilla.org/en/CSS/transform CSS_transform_functions