【Canvas】狗撵兔子和贝塞尔曲线


先上图:

代码:

DOCTYPE html>
<html lang="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<head>
     <title>狗撵兔子与贝塞尔曲线title>
     <style type="text/css">
     .centerlize{
        margin:0 auto;
        border:0px solid red;
        width:1200px;height:550px;
     }

     style>
    head>

     <body onload="draw();">
        <div class="centerlize">
            <canvas id="myCanvas" width="1200px" height="550px" style="border:1px dashed black;">
                出现文字表示您的浏览器尚不支持HTML5 Canvas
            canvas>
        div>
     body>
html>
<script type="text/javascript">

script>

小记:

原以为狗撵兔子的曲线会和控制点为(0,200),结束点为(132.5,200)的贝塞尔二次曲线重合,结果却与预期不同。

看来,狗撵兔子的曲线应该是摆线(最优降速线),而贝塞尔曲线不是摆线。这个结论有待日后证明。

END

相关