Tagged: canvas

html5 canvas绘图之context.clearRect 区域删除实例

html5 canvas绘图之context.clearRect 区域删除实例

html5 canvas绘图之clearRect之区域删除,先来了解下函数定义 context.clearRect(x, y, width, height) 把...

html5 canvas绘图之context.moveTo,context.lineTo,绘制直线实例

html5 canvas绘图之context.moveTo,context.lineTo,绘制直线实例

绘制直线 context.moveTo(x,y)  context.lineTo(x,y) x,y 绘制坐标 context.moveTo(x,y) 绘制起点 ...

html5 canvas绘图之context.strokeRect 边框矩形实例

html5 canvas绘图之context.strokeRect 边框矩形实例

canvas绘制矩形需要要用到两个函数context.fillRect和context.fillStyle context.strokeRect(x, y, w...

html5 canvas绘图之context.beginPath,context.closePath路径实例

html5 canvas绘图之context.beginPath,context.closePath路径实例

画圆并不单单是直接用arc,它还用到beginPath()方法,和closePath()方法,如果没有重新beginPath那么前面的路劲会保留。 系统默认在绘...

html5 canvas绘图之context.fillStyle,context.strokeStyle颜色实例

html5 canvas绘图之context.fillStyle,context.strokeStyle颜色实例

html5 canvas绘图之fillStyle,strokeStyle颜色实例 context.fillStyle(“”) 填充颜色(...

html5 canvas绘图之context.arc画圆(狐)实例

html5 canvas绘图之context.arc画圆(狐)实例

canvas绘图画圆是用一个arc方法,它是从一个中心坐标点,半径为长度,画出从开始角度到结束角度的圆。 context.arc(x, y, radius, s...

html5 canvas绘图之径向渐变createRadialGradient,addColorStop实例

html5 canvas绘图之径向渐变createRadialGradient,addColorStop实例

径向渐变(发散)var rg=context.createRadialGradient(xStart,yStart,radiusStart,xEnd,yEnd,...

html5 canvas绘图之createLinearGradient,addColorStop 绘制渐变图

html5 canvas绘图之createLinearGradient,addColorStop 绘制渐变图

html5 canvas可纵向渐变图形,能定义渐变色、偏移量等元素,下面来看看具体用法。 线性渐变 context.createLinearGradient(x...

html5 canvas绘图之context.fillRect 矩形填充实例

html5 canvas绘图之context.fillRect 矩形填充实例

canvas绘制矩形需要要用到两个函数ctx.fillRect和ctx.fillStyle context.fillRect(x, y, width, heig...