Question

我需要一些方向，因为我不清楚我做错了什么。我试图做的只是在画布中心加载一个位图，但它没有显示出来。我的文件路径是正确的，我不知道我可能编码错误，我哪里出错？

int

Answer 1

这个库看起来处理绘图到画布的方式是调用stage.update()，他们建议将它们附加到他们的＆＃34; tick＆＃34;事件（例如http://www.createjs.com/docs/easeljs/classes/Stage.html）

基本上，我们需要不断重绘画布，而createjs为我们提供了一种方法，如下所示：

createjs.Ticker.addEventListener("tick", handleTick);
function handleTick(event) {
     stage.update();
}

但是，由于您尚未使stage全局可访问，因此我稍微调整了您的初始化函数，以便我们可以通过在函数末尾返回stage来访问它。因此，您可以将全局范围中的stage设置为函数的结果：

var stage = init();

handleTick默认使用stage。但是，如果您考虑在init()函数之外重用对象，则可能需要考虑将它们传递给init函数或将其初始数据结构保留在init函数之外它们更容易访问。

https://jsfiddle.net/jpgw1oka/

Answer 2

确保您正在加载CreateJS库：https://code.createjs.com/createjs-2015.11.26.min.js。

删除'use strict'。

确保在window.onload事件监听器中声明变量和函数调用。

E.g。

var canvas, stage;

function init() {

canvas = document.getElementById("easel");
stage = new createjs.Stage(canvas);

var ship = new createjs.Bitmap("../images/millenium.png");

ship.x = Math.floor(stage.canvas.width * 0.5);
ship.y = Math.florr(stage.canvas.height * 0.5);
ship.regX = Math.floor(ship.image.width * 0.5);
ship.regY = Math.floor(ship.image.height * 0.5);

stage.addChild(ship);
stage.update();

}

位图图像未显示在画布中

2 个答案: