在CreateJS中显示未捕获的类型错误。没有显示任何输出..我的代码如下

时间:2015-02-05 03:31:29

标签: javascript easeljs createjs

它在createjs文件中显示一些错误。

<html>
<head>
<title></title>
<script src="https://code.createjs.com/createjs-2014.12.12.min.js">
</script>       <script>
var preload,cW,cH,winW,winH;
var road,city1,city2,sky,build1,build2;
window.onload = function(){
    var canvas = document.getElementById("demoCanvas");
   var stage = new  createjs.Stage(canvas);
cW=1200;
cH=600;
    preload = new createjs.LoadQueue(true);

    var manifest =[{id:"ad_road",src:"road.png"},
        {id:"ad_build1",src:"build.png"},
        {id:"ad_build2",src:"build.png"},
        {id:"ad_farbuild1",src:"layer3.png"},
        {id:"ad_land",src:"land1.png"},
        {id:"ad_farbuild2",src:"layer1.jpg"},
        {id:"ad_sky",src:"sky.png"}
    ];
    preload.loadManifest(manifest);
    preload.on("complete",handleComplete);


function handleComplete(){
    sky = new createjs.Shape();
    sky.graphics.beginBitmapFill(preload.getResult("ad_sky"),"repeat-x").drawRect(0, 0, 1200,600);

    var roadImg = preload.getResult("road");
    road = new createjs.Shape();
    road.graphics.beginBitmapFill(roadImg).drawRect(0, 0, cW + roadImg.width, roadImg.height*1);
    road.tileW = roadImg.width;
    road.y = cH - roadImg.height;

    /*var matrix = new createjs.Matrix2D(1,2,3,4,5,6);*/

    build1 = new createjs.Bitmap(preload.getResult("ad_build1"));
    build1.setTransform(Math.random()*cW ,cH - build1.image.height * 0.7 - roadImg.height, 0.7,0.7);
    build1.alpha = 1;

    build2 = new createjs.Bitmap(preload.getResult("ad_build2"));
    //console.log(cH - build2.image.height * 1 - roadImg.height);
    build2.setTransform(Math.random()*cW ,cH - build2.image.height * 0.7 - roadImg.height, 0.7,0.7);
    build2.alpha = 1;

    stage.addChild(sky,build1,build2,road);
    createjs.Ticker.timingMode = createjs.Ticker.RAF;
    document.onkeydown = tick;
}
    //createjs.Ticker.addEventListener("tick", tick);


function tick(event){
    if(event.keyCode === 37){
        var deltaS = event.delta / 1000 || 40/1000;
        road.x = (road.x - deltaS * 200) % road.tileW;

        build1.x = (build1.x - deltaS * 60);
        if (build1.x + build1.image.width * build1.scaleX <= 0) {
            build1.x = cW;
        }
        build2.x = (build2.x - deltaS * 75);
        if (build2.x + build2.image.width * build2.scaleX <= 0) {
            build2.x = cW;
        }
        stage.update(event);
    }
    }
    }
</script>
</head>
<body>
<p><canvas height="600" id="demoCanvas" width="1300"> </canvas></p>
</body>
</html>

显示以下错误 console-log:未捕获TypeError:无法在'CanvasRenderingContext2D'上执行'createPattern':找不到与提供的签名匹配的函数。

1 个答案:

答案 0 :(得分:1)

正如Lanny在评论中所述,当您将无效图像(空白,未完全加载,损坏,404等)传递到beginBitmapFill时会发生此错误。

确认您的图片正确加载。

我刚推送更新到绕过此RTE的EaselJS NEXT,并忽略了无效的位图填充。