我在画布上的EaselJS位图在Firefox中正常渲染但是（有时）没有缩放并占用Chrome中的整个画布？

Question

为了证明这一点（我正在研究一个更加压缩的小提琴），open this in chrome，并使用箭头键移动Jay-Z并捕获约4-5（有时更多！）蛋糕。

你会注意到屏幕左侧有一块巨大的蛋糕。

我在handleTick功能中更新蛋糕位置，并按时间间隔添加新蛋糕。以下是这两个：

/*This function must exist after the Stage is initialized so I can keep popping cakes onto the canvas*/
function make_cake(){
    var path = queue.getItem("cake").src;
    var cake = new createjs.Bitmap(path);
    var current_cakeWidth = cake.image.width;
    var current_cakeHeight = cake.image.height;
    var desired_cakeWidth = 20;
    var desired_cakeHeight = 20;
    cake.x = 0;
    cake.y = Math.floor((Math.random()*(stage.canvas.height-35))+1); //Random number between 1 and 10
    cake.scaleX = desired_cakeWidth/current_cakeWidth;
    cake.scaleY = desired_cakeHeight/current_cakeHeight;
cake.rotation = 0;
    cake_tray.push(cake);
    stage.addChild(cake);
}

setInterval部分：

setInterval(function(){
    if (game_on == true){
        if (cake_tray.length < 5){
            make_cake();
        }
    }
    else{
        ;
    }
},500);

stage.update也来自handleTick。

Here is the entire JS file

感谢您对此进行调查。请再次注意，这只发生在Chrome中，我还没有看到它在Firefox上发生过。目前不关心其他浏览器。

Answer 1

使用实际加载的图像可能更有意义，而不是使用项目的来源。通过传递源，图像最初可能具有0宽度/高度，从而导致缩放问题。

// This will give you an actual image reference
var path = queue.getResult("cake");