createjs MotionGuidePlugin

最新推荐文章于 2025-06-11 18:58:00 发布

飞驰的蜗牛牛

最新推荐文章于 2025-06-11 18:58:00 发布

阅读量227

点赞数

分类专栏： HTML5 文章标签： elementui javascript ecmascript

本文链接：https://blog.youkuaiyun.com/shuishou1000/article/details/122245148

版权

HTML5 专栏收录该内容

16 篇文章

订阅专栏

html

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">

    <title></title>
   <script src="lib/easeljs-0.7.1.min.js" charset="utf-8"></script>
   <script src="lib/tweenjs-0.5.1.min.js" charset="utf-8"></script>
   <script src="lib/MotionGuidePlugin.js" charset="utf-8"></script>
  </head>
  <body onload="init()">
    <canvas id="canvas" width="300" height="300"></canvas>
  </body>
  <script src="app.js" charset="utf-8"></script>
</html>

app.js

var stage

function init(){
  stage=new createjs.Stage("canvas")
  createjs.Ticker.addEventListener("tick",tickFn)
  createjs.Ticker.setFPS(60)
  createjs.MotionGuidePlugin.install(createjs.Tween)

  start()
}

 function start(){
    var circle=new createjs.Shape()
    circle.graphics.beginFill("#339999").drawCircle(0,0,50)


    createjs.Tween.get(circle,{loop:false},true)
                  .to({guide:{path:[100,100,400,100,200,300],orient:true}},5000)
    stage.addChild(circle)

 }
 function tickFn(e){
   stage.update()
 }

关注博主即可阅读全文