Question

我想在对象可以移动的tilemap中添加一个对象（太空飞船）。我已经在画布中创建了一个tilemap。还有一些按钮可以导航它们。还有一个按钮可以在地图上创建太空飞船。

问题是，我无法访问被Canvas绘制的宇宙飞船。我的想法是，我创建了一个图像类，它将帮助我通过Jquery访问图像。但那不起作用。有一个简单的方法，如何通过单击按钮移动图片？

$("#b_generate_ship").click(function() {
    var spaceship = new Image();
    spaceship.src = '\grafiken\/spaceship.png'
    spaceship.className = "spaceship";
    context.drawImage(spaceship , 600, 50);   
    console.log("Ship generated");
});

$("#b_fly_left").click(function() {
    $(".spaceship").animate({ "left": "+=50px" }, "slow" );
    console.log("left flight");
});

Answer 1

将Pixi.js用于此类画布maniuplation，您可以在画布上绘制时创建并跟踪精灵对象，并为其制作动画+一大堆其他令人敬畏的东西。

http://www.pixijs.com/

在画布上访问绘制的图像

1 个答案: