CreateJSは描画しません

私はHTML5キャンバスを描画するためにcreateJSを使用しています。すべてがうまくいくようですが、形は描かれません。以下のコードです：ここでCreateJSは描画しません

$(document).ready(function(){ 

    var canvas, stage, line; 
    canvas = document.getElementById('weigh'); 
    stage = new createjs.Stage(canvas); 

    function drawLine(){ 
    line = new createjs.Shape(); 
    line.graphics.moveTo(5, 10).setStrokeStyle(1).beginStroke('#ff0000').lineTo(300, 10); 
    stage.addChild(line); 
    } 

    drawLine(); 

    createjs.Ticker.on('tick', ticking); 
    createjs.Ticker.setFPS(60); 

    function ticking(event){ 
    line.rotation += 5; 
    console.log('ticking'); 
    } 

});

は、HTMLです：

<!DOCTYPE html> 
<html> 
<head> 
    <title>Canvas</title> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jcanvas/16.7.3/jcanvas.min.js"></script> 
    <script type="text/javascript" src="https://code.createjs.com/createjs-2015.11.26.min.js"></script> 
    <link rel="stylesheet" href="weigh.css" type="text/css"> 
    <script type="text/javascript" src="test.js"></script> 
</head> 
<body> 
    <div id="canvas"> 
     <canvas id="weigh" width="382" height="382">alternate content</canvas> 
    </div> 
</body> 
</html>

すべてが期待通りに表示されます。コンソールログは期待どおりに記録されます。行方不明の唯一のものは私が描く線であり、私はなぜそれを見つけることができません。誰かが間違いを指摘できますか？

出典

2016-10-11 Yong Quan

ステージを更新していないようです。あなたのticking方法で更新呼び出しを追加します。

function ticking(event){ 
    line.rotation += 5; 
    stage.update(event); 
    console.log('ticking'); 
}

ステージの更新は、ステージコンテンツを再描画します。自動的には発生せず、高価な呼び出しであるためコンテンツをいつ再描画するかを制御する機会を提供します。

乾杯。

出典

2016-10-11 15:40:47 Lanny

CreateJSは描画しません

答えて

関連する問題