javascript - 如何使用 Phaser 加载图像

标签 javascript html phaser-framework

我正在尝试学习如何使用 Phaser,按照有关如何加载图像的在线说明进行操作; Phaser 提供的示例之一是加载图像示例。

这是 Phaser 提供的代码。

var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create });

function preload() {

    //  You can fill the preloader with as many assets as your game requires

    //  Here we are loading an image. The first parameter is the unique
    //  string by which we'll identify the image later in our code.

    //  The second parameter is the URL of the image (relative)
    game.load.image('einstein', 'assets/pics/ra_einstein.png');

}

function create() {

    //  This creates a simple sprite that is using our loaded image and
    //  displays it on-screen
    game.add.sprite(0, 0, 'einstein');

}

html

<html>
<head>
  <meta charset="UTF-8">
  <title>Experiments</title>
  <script src="../phaser.js"></script>
  <script src="game.js"></script>
</head>
<body>

</body>
</html>

我正在尝试在我的服务器上运行此代码(使用节点),但我没有看到图像,有人可以解释我做错了什么吗?

最佳答案

尝试添加<div id="phaser-example"></div>里面<body></body>标签

<html>
   <head>
       <meta charset="UTF-8">
       <title>Experiments</title>
       <script src="../phaser.js"></script>
       <script src="game.js"></script>
   </head>
   <body>
        <div id="phaser-example"></div>
   </body>
</html>

js:

var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create });

function preload() {

    //  You can fill the preloader with as many assets as your game requires

    //  Here we are loading an image. The first parameter is the unique
    //  string by which we'll identify the image later in our code.

    //  The second parameter is the URL of the image (relative)
    game.load.image('einstein', 'assets/pics/ra_einstein.png');

}

function create() {

    //  This creates a simple sprite that is using our loaded image and
    //  displays it on-screen
    game.add.sprite(0, 0, 'einstein');

}

关于javascript - 如何使用 Phaser 加载图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27996228/

相关文章:

javascript - 如何获取这个对象中的值?

javascript - jqmath 中如何表示删除线?

javascript - 使用 Jasmine 2.0 和 PhantomJS 对 ext js 进行单元测试

javascript - 如何测试nodejs中流的错误?

javascript - Phaser 更新 Sprite 纹理

jquery - 使用输入文本框控制带有背景颜色的输入范围 slider

html - 带有表情符号的HTML字符串Swift

javascript - 当鼠标悬停在该行的任意位置时,我可以使 TableRow 列中的图标改变颜色吗?

javascript - Phaser js php 排行榜

reactjs - 有没有办法使 Phaser 游戏对象成为 react 控制组件?