将精灵链接到.txt文件P5JS / P5.PLAY

问题描述

我正在尝试使用p5js和p5.play制作游戏。这是一款自上而下的2D赛车游戏，其背景是通过创建子画面并将其链接到名为“ track.txt”的.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

解决方法

您可以执行以下操作：

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]];
}