html中lineJoin示例

来源:互联网 发布:和晟实业投资 知乎 编辑:程序博客网 时间:2024/06/08 08:15
<!DOCTYPE html><html><head><meta charset="utf-8"/><title>lineJoin</title><script>function draw(id){var context=document.getElementById('canvas').getContext('2d');var lineJoin=['round','bevel','miter'];context.strokeStyle='#09f';context.linewidth='10';for(var i=0;i<lineJoin.length;i++){context.lineJoin=lineJoin[i];context.beginPath();context.moveTo(-5,5+i*40);context.lineTo(35,45+i*40);context.lineTo(75,5+i*40);context.lineTo(115,45+i*40);context.lineTo(155,5+i*40);context.stroke();}}</script></head><body onload="draw('canvas');"><h1>lineJoin</h1><canvas id="canvas" width="400" height="300"/></body></html>

原创粉丝点击