本文目录一览：
JS中canvas画布绘制中如何实现缩放,位移,旋转
1、这里首先绘制了一个黑色矩形，然后调用 setTransform() 方法，接着把画布旋转 45 度，最后绘制红色矩形。因为没有指定旋转原点，所以默认原点在 (0，0) ，导致红色矩形旋转后，有一半的区域移到了画布之外。
2、思路：限定canvas的范围，获取到2d句柄后，可以调用scale方法进行缩放。
3、简单思路就是：禁止浏览器缩放；处理touch事件，当为两指操作缩放时停止事件传播；canvas方面，始终设置context的原点在canvas元素中心点；每次触发缩放就clear掉整个画布，然后使用context.scale缩放，然后全部重新画。-canvasjs视觉差滚动
4、其实，Canvas 的设置项还有许多，例如我们可以直接移动画布、旋转画布、设置全局的绘制透明度等等。这些设置还可以随时保存和恢复。要注意的一点是，所有已经画在画布上的东西，是已经定死了的，不管之后再次进行任何设置都不会再改变。-canvasjs视觉差滚动
canvas动画性能好还是纯js动画性能好?
1、css3动画很丰富，并且浏览器支持度相对已经很好了。
2、我们可以先把待绘制的区域裁剪好，保存起来，这样每次绘制时就能轻松很多 drawImage 方法的第一个参数不仅可以接收 Image 对象，也可以接收另一个 Canvas 对象。
3、都是通过js来实现的，只要纯js写的足够优化，是会比pjs快一丢丢的，差异不明显。明显的差异是pjs在网页加载时需要下载pjs的类库才能进行操作，而canvas api由于是客户端提供的原因，则不需要。-canvasjs视觉差滚动
4、首先canvas和SVG不是对立的，应用场景不同，各有各的用处.svg可缩放矢量图形常用在地图和矢量图标制作等，不会因为放大缩小而失真。canvas是基于js的绘图标签常用于网页游戏的制作如js的飞机大战，也可以用来做网页的刮奖等。-canvasjs视觉差滚动
5、小程序中使用的canvas是原生组件，与js的是完全一样的。
js中canvas的linewidth怎么使用
如果要用xor清除内容，那么就先清除，之后恢复globalCompositeOperation为默认值source-over，最后再画一个新的圆形路径用来描边。描边的时候还需要考虑lineWidth对实际描的区域的影响，适当的画大一点。-canvasjs视觉差滚动
标签中的width和height去掉了，但在JavaScript代码中设置了canvas对象的width和height的属性。小结：要设置画布的大小，只有这两种方法 在标签中设置；在JS代码中设置canvas的属性.怎么样，是不是非常的酷。-canvasjs视觉差滚动
canvas 元素负责在页面中设定一个区域，然后就可以通过 JavaScript 动态地在这个区域中绘制图形。 要使用 canvas 元素，必须先设置其 width 和 height 属性，指定可以绘图的区域大小。-canvasjs视觉差滚动
Canvas 中的基本图形 通过上文定义的 ctx 变量可以干许多有意思的事情，我们先看看如何绘制一些基本图形。线条 我们指定画笔移动到某一点，然后告诉画笔需要从当前这一点画到另一点。
矩形的绘制。在Canvas中，绘制矩形有三种方法：填充(fillRect)、描边(StrokeRect)以及清除(clearRect)。当然，我们也可以使用路径来描绘包括矩形在内的所有图形。
