HTML5画一个简单呢好看的电路图

百变鹏仔 2个月前 (10-18) #H5教程

文章标签电路图

画图api的应用，线，圆等

最近特别忙，承蒙大伙关照，自己折腾着做了个HTML5画电路图

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">    <title>何问起</title><meta name="description" content="canvas画简单电路图 by hovertree.com" /></head><body>    <canvas id="canHewenqi" width="500" height="300" style="margin: 20px auto"></canvas>         <script>        var canvas = document.getElementById("canHewenqi");        var cxt = canvas.getContext("2d");cxt.moveTo(10,10);        cxt.lineTo(100,10);        cxt.stroke();        cxt.beginPath();        cxt.moveTo(100,10);        cxt.lineTo(100,0);        cxt.lineTo(150,0);        cxt.lineTo(150,20);        cxt.lineTo(100,20);        cxt.closePath();        cxt.moveTo(150,10);        cxt.lineTo(250,10);        cxt.lineTo(250,100);        cxt.stroke();        cxt.moveTo(225,100);        cxt.lineTo(275,100);        cxt.stroke();        cxt.moveTo(225,115);        cxt.lineTo(275,115);        cxt.stroke();        cxt.moveTo(250,115);        cxt.lineTo(250,160);        cxt.stroke();        cxt.moveTo(250,160);        cxt.lineTo(150,160);        cxt.stroke();        cxt.arc(130,160,20,0,360,false);        cxt.stroke();        cxt.moveTo(150,160);        cxt.lineTo(10,160);        cxt.lineTo(10,10);        cxt.stroke();              </script><div>canvas画简单电路图 by 何问起</div><!--http://hovertree.com/code/html5/fatorqgm.htm--></body></html>

【

文章推荐

HTML5画一个简单呢好看的电路图

HTML在线编辑器的调用方法和使用方法

AlloyTouch全屏滚动插件 30秒搞定顺滑H5页

HTML5 js实现拖拉上传文件功能

Canvas and Drawables 翻译第一集

Canvas and Drawables 翻译第三集