canvas入门

python基础教程

于 2016-12-08 15:31:35 发布

阅读量314

点赞数

分类专栏： 07canvas

本文链接：https://blog.youkuaiyun.com/stopcpp/article/details/53519065

版权

07canvas 专栏收录该内容

12 篇文章

订阅专栏

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
    </head>
    <body>
        <canvas id="demo" width="600px" height="600px">
            你的浏览器不支持canvas，请升级浏览器
            <!-- flash -->
        </canvas>
        <script>
            window.onload = function(){
                var canvas = document.getElementById('demo');
                var ctx = canvas.getContext("2d");
                ctx.moveTo(100, 100);//画笔移动到100,100
                ctx.lineTo(200, 100);//画直线到200,100
                ctx.lineTo(100, 200);
                //ctx.lineTo(100, 100);
                ctx.closePath();//闭合路径
                //设置线宽
                ctx.lineWidth = 4;
                ctx.strokeStyle = 'rgba(233,233,233,.8)';//设置描边样式
                ctx.stroke();//描边
                ctx.fillStyle = "blue";
                ctx.fill();
            }
        </script>
    </body>
</html>

这里写图片描述