简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Phaser gagal memuatkan peta jubin, dan skrin hanya memaparkan skrin hitam
P粉832490510
P粉832490510 2024-03-30 20:38:02
0
1
415

Saya cuba memuatkan peta jubin yang dibuat dalam editor peta Berjubin. Saya telah mengeksportnya sebagai fail json dan meletakkannya dalam folder aset dalam folder awam bersama set jubin saya. Semua yang muncul di kanvas adalah hitam. Saya cuba menukar kedudukan kamera untuk melihat sama ada itu membuat perbezaan, tetapi tidak berjaya. Saya tidak mendapat sebarang mesej ralat dan pada tab rangkaian saya dapat melihat peta dan set jubin dimuatkan. Saya tidak dapat mencari jawapan untuk masalah ini.

Saya utama.js

var config = {
  type: Phaser.CANVAS,
  width: 800,
  height: 600,
  scene: {
    preload: preload,
    create: create,
    update: update,
  },
  render() {
    Phaser.Renderer.CANVAS
  },
}

var game = new Phaser.Game(config)

function preload() {
  console.log('preload')
  // 在这里加载资源
  this.load.setBaseURL('http://localhost:5500/public/assets/')
  this.load.tilemapTiledJSON('map', 'map.json')
  this.load.image('tiles', 'Tileset.png')
}

function create() {
  // 在这里设置游戏对象和逻辑
  const map = this.make.tilemap({ key: 'map' })
  const tileset = map.addTilesetImage('RPG_Tileset', 'tiles')
  console.log(tileset)
  const layer = map.createLayer('Tile Layer 1', tileset, 0, 0)

  // 居中图层
  const width = layer.widthInPixels
  const height = layer.heightInPixels
  layer.setPosition(
    game.config.width / 2 - width / 2,
    game.config.height / 2 - height / 2
  )

  // 设置相机以显示地图的相关部分
  this.cameras.main.setBounds(0, 0, game.config.width, game.config.height)
  this.cameras.main.centerOn(map.widthInPixels / 2, map.heightInPixels / 2)
}

function update() {
  // 在这里更新游戏状态
}

Indeks saya.html:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>My Phaser Game</title>
  </head>
  <body>
    <canvas id="game"></canvas>
    <script src="https://cdn.jsdelivr.net/npm/phaser@3.55.2/dist/phaser.min.js"></script>
    <script src="main.js"></script>
  </body>
</html>

Saya telah log set jubin dan peta dan kedua-duanya memuatkan objek dengan betul. Sebarang bantuan amatlah dihargai.

EDIT: Saya juga mengklon repositori pada github yang sepatutnya berfungsi dengan baik, tetapi saya menghadapi masalah yang sama dalam kod mereka. Benar-benar tidak tahu apa yang berlaku. Ini adalah repositori yang saya periksa dari github: https://github.com/ourcade/phaser3-dungeon-crawler-starter

P粉832490510
P粉832490510

membalas semua(1)
P粉459578805
P粉4595788052024-03-31 11:48:01 Tingkat 1

Semuanya nampak baik kecuali config中的renderfungsi yang saya tidak faham. Anda boleh menyemak nama Layer dan Tileset dalam JSON/Tiled dan kod anda untuk melihat sama ada ia sepadan (perhatikan ruang dan huruf besar yang betul) . Ini boleh menyebabkan peta gagal dilukis. Terutama ayat berikut:

  1. const map = this.make.tilemap({ key: 'map' })
    • Inilah kunci map
  2. const tileset = map.addTilesetImage('RPG_Tileset', 'tiles')
    • Ini adalah RPG_Tileset和tiles
  3. const layer = map.createLayer('Tile Layer 1', tileset, 0, 0)
    • Ini adalah Tile Layer 1

Malah kehilangan ruang belakang boleh menyebabkan penciptaan gagal.

By the way: Adakah anda memuat turun fail zip SourceWithAssets.zip dari sini https://github.com/ourcade/phaser3-dungeon-crawler-starter/,releases Atau jika ia seperti arahan readme.md中提到的那样使用了git-lfs？如果是这样，它应该可以工作，我刚刚尝试了一下，它可以工作。如果不行，请确保更新您的node和/或npm版本，并按照readme中的说明在主文件夹中执行npm install.

Suka +0
Tambah Balasan
Topik popular
Lagi>
Artikel popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina：Latihan PHP dalam talian kebajikan awam，Bantu pelajar PHP berkembang dengan cepat！