网络工具:http://www.j--d.com/bezier
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>贝塞尔曲线</title><style type="text/css">*{ padding:0px;margin:0px;}</style><script type="text/javascript">function Draw(){ //获取js对象 var c=document.getElementById("canvas"); c.width=500; c.height=500; //获取用于绘制图形的2d环境 var ctx=c.getContext("2d"); ctx.lineWidth=6; ctx.strokeStyle="#ff0000"; ctx.beginPath(); //起点 ctx.moveTo(100,200); //二次贝塞尔曲线 //ctx.quadraticCurveTo(75,50,300,200); //三次贝塞尔曲线 ctx.bezierCurveTo(205,56,239,439,429,236); ctx.stroke(); }</script></head><body> <canvas id="canvas"></canvas> <input type="button" value="Canvas" οnclick="Draw();"/></body></html>