zoukankan html css js c++ java

Canvas贝塞尔三级曲线

两个控制点

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>bezierCurveTo</title>
</head>

<body>
    <canvas id='myCanvas' width='400' height='200'>
        your browser does not support canvas
    </canvas>
    <script type="text/javascript">
    var c = document.getElementById('myCanvas');
    var cxt = c.getContext('2d');
    cxt.beginPath();
    var sx = 20,
        sy = 100,
        cx1 = 45,
        cy1 = 70,
        cx2 = 95,
        cy2 = 130,
        ex = 120,
        ey = 100;
    cxt.moveTo(sx, sy);
    cxt.bezierCurveTo(cx1,cy1,cx2,cy2,ex,ey);
    cxt.moveTo(sx, sy);
    cxt.lineTo(cx1,cy1);
    cxt.lineTo(cx2,cy2);
    cxt.lineTo(ex,ey);
    cxt.moveTo(0, 100);
    cxt.lineTo(140, 100);
    cxt.stroke();
    </script>
</body>

</html>

查看全文

相关阅读:
参考资料来自懒兔子的公众号
 Etcd
zookeeper 杂记
 十二五
 防火墙
 APScheduler
docker管理工具protainer
java学习笔记
 linux学习笔记1
[POI2007]ZAP-Queries

原文地址：https://www.cnblogs.com/stono/p/4666952.html