Estoy tratando de crear un grupo para un objeto que puse en el DOM, pero no sé cómo, ya que no tiene una clave para configurarlo en la función preload() , he precargado un elemento de intervalo, y en the create() He creado un elemento en el DOM.
preload(){ this.span = document.createElement('span') } create(){ this.img = '/assets/sprites/shouko.png' this.span.style = `background: url("${this.img}"); background-size: cover; width: 60px; height: 60px; font-weight: bold`; this.element = this.add.dom(400, 300, this.span) this.physics.add.existing(this.element, false);// add sptite this.element.body.setOffset(-(this.element.displayWidth / 2), -(this.element.displayHeight / 2)); this.element.body.setVelocity(100, 200); this.element.body.setBounce(1, 1); this.element.body.setCollideWorldBounds(true); }Su pregunta no es muy clara, pero supongo que desea un grupo de fases , con elementos dom .
Entonces, en este caso especial, crearía el elemento dom con el método phaser this.add.dom().createElement(...) ( enlace a la documentación ), y los agregaría a un grupo phaser.
Aquí una demostración de trabajo:
document.body.style = 'margin:0;'; var config = { type: Phaser.AUTO, width: 536, height: 183, parent: 'phaser-parent', dom: { createContainer: true }, physics: { default: 'arcade', }, scene: { create }, banner: false }; function create () { let imgUrl = 'http://labs.phaser.io/assets/sprites/copy-that-floppy.png'; let style = `background: url("${imgUrl}"); background-size: cover; width: 60px; height: 60px`; var group = this.add.group(); for(var i = 0; i < 3; i++){ var element = this.add.dom().createElement('span', style); this.physics.add.existing(element, false); element.x = 50 * (i+1); element.y = 50 * (i+1); element.body.setOffset(-(element.displayWidth / 2), -(element.displayHeight / 2)); element.body.setVelocity(100, 200); element.body.setBounce(1, 1); element.body.setCollideWorldBounds(true); group.add(element); } } new Phaser.Game(config); <script src="https://cdn.jsdelivr.net/npm/phaser@3.55.2/dist/phaser.js"></script> <div id="phaser-parent"></div>