Связывание спрайтов с файлом .txt (P5JS / P5.PLAY)

#javascript #text #sprite #p5.js

#javascript #текст #спрайт #p5.js

Вопрос:

Я пытаюсь создать игру, используя p5js и p5.play. Это 2d-гоночная игра сверху вниз, в которой фон создается путем создания спрайтов и связывания их с числами из файла .txt, называемого ‘track.txt «.

Я не могу найти в Интернете ничего, что даже подсказывало бы, на что мне следует обратить внимание.

Цифры выглядят следующим образом:

 0 = Grass
1 = Track
2 = Finish/Start line

   0 0 0 0 0 0 0 0 0 
   0 1 1 1 1 1 1 1 0
   0 1 0 0 0 0 0 1 0
   0 1 0 1 1 1 0 2 0
   0 1 0 1 0 1 0 1 0
   0 1 0 1 0 1 0 1 0
   0 1 0 1 0 1 0 1 0
   0 1 0 1 0 1 0 1 0
   0 1 1 1 0 1 1 1 0
   0 0 0 0 0 0 0 0 0

  

Комментарии:

1. Вы можете поместить спрайты в массив и использовать число из текстового файла в качестве индекса.

2. Как бы я это сделал? Я новичок в кодировании, и все видео, которые я вижу, не говорят об этом типе проблемы

3. вы здесь не задаете вопрос… с какой проблемой вы столкнулись?

4. Вы считываете числа текстового файла в двумерный массив? Название этого метода — «движок плиток», возможно, это поможет найти ресурсы.

Ответ №1:

Вы можете сделать что-то вроде этого:

 let track = [];
let images = [];

function preload() {
  images[0] = loadImage("grass.png");
  images[1] = loadImage("track.png");
  images[2] = loadImage("finish.png");
}

function setup() {
  createCanvas(400, 400);
  loadStrings("track.txt", getTrack);
}

function getTrack(arr){
  for(let i = 0; i < arr.length; i  )
  {
    let line = arr[i].trim();  //This is to make sure trailing spaces don't break the code
    let tempArr = line.split(" ");
    track.push(tempArr);
  }
}
  

Затем вы можете получить изображение следующим образом:

 function getImage(col, row) {
  return images[track[col][row]];
}