Используя Javascript с Phaser 3, я пытаюсь нарисовать прямоугольник на холсте. Нарисовать круг тем же методом не проблема, но прямоугольники не работают. Как нарисовать прямоугольник? Я продемонстрировал свои текущие попытки сделать это ниже. Круг отображается, а прямоугольник - нет.
<!DOCTYPE html>
<html>
<head>
<title>Colour Circles</title>
<script src="https://cdn.jsdelivr.net/npm/phaser@3.15.1/dist/phaser-arcade-physics.min.js"></script>
</head>
<body>
<script>
function create() {
const rect = this.add.rectangle(200, 200, 30, 30, 0x4c7df3);
const circle = this.add.circle(200, 200, 30, 0x4c7df3);
}
const config = {
type: Phaser.WEBGL,
parent: 'phaser-game',
backgroundColor: 0xffc836,
width: 440,
height: 550,
scene: {
create,
}
};
const game = new Phaser.Game(config);
</script>
</body>
</html>
Далее: с этим кодом будет отображаться прямоугольник, но только до тех пор, пока остальной код присутствует. Если какая-либо из этих строк отсутствует, команда this.add.rectangle не работает.
function create ()
{
rect1 = this.add.rectangle(200, 475, 440, 75, 0x37c3be);
const spacing = 4 / gameState.palette.length;
const translation = spacing / 2;
for (let i = 0; i < gameState.palette.length; i++) {
let color = gameState.palette[i];
let paletteCircle = this.add.circle(translation + spacing * i, 515, 22, color);
}
}