javascript - p5js ("syntaxerror : expected ; but found table"中的 xml 文件出错)

Question

使用 p5.js，我尝试绘制 12 个具有随机颜色的正方形，按下鼠标时可以重新绘制这些正方形 - 我使用下面的代码进行了操作:

function setup() {
//build-up canvas w/ 12 squares
createCanvas(800, 600);

for (var y=0; y<600;y+=200) {
  for (var x=0; x<800; x+=200) {
    fill(random(255), random(255), random(255));
    rect(x, y, 200, 200)
  }
}
function touchStarted() {
// figure-out where to redraw square
  var qX = (mouseX - (mouseX % 200)) / 200
  var qY = (mouseY - (mouseY % 200)) / 200

 fill(random(255), random(255), random(255));
 rect(qX*200, qY*200, 200, 200);
}

但现在我正在尝试将数据保存在具有此类内容的 xml 文件中:

<build>
    <square id="0" posx="0", posy="0">30</square>
    <square id="1" posx="200", posy="0">60</square>

我正在尝试将其用作 ( https://p5js.org/reference/#/p5.XML ) 的引用:

var xml;

function preload() {
  xml = loadXML("assets/data.xml");
}

function setup() {
  // build-up canvas w/ 12 squares
  createCanvas(800, 600);

  var children = xml.getChildren("build");

  for (var i=0; i < children.length; i++) {
    var xpos = children[i].getNum("posx");
    var ypos = children[i].getNum("posy");
    var coul = children[i].getContent();
    fill(coul);
    rect(xpos, ypos, 200, 200);
  }

但我只收到错误“SyntaxError:预期；但找到了表”，所以我真的迷路了......

感谢您的帮助!

Answer 1

试试这个:我已将 var Children = xml.getChildren("build"); 更改为 var Children = xml.getChildren("square");

var xml;

function preload() {
  xml = loadXML("assets/data.xml");
}

function setup() {
  // build-up canvas w/ 12 squares
  createCanvas(800, 600);

  var children = xml.getChildren("square"); // <----- CHANGED IT FROM BUILD TO SQUARE

  for (var i=0; i < children.length; i++) {
    var xpos = children[i].getNum("posx");
    var ypos = children[i].getNum("posy");
    var coul = children[i].getContent();
    fill(coul);
    rect(xpos, ypos, 200, 200);
  }

另外，不要忘记关闭 xml 文件内部。应该看起来像这样:

<build>
<square id="0" posx="0", posy="0">30</square>
<square id="1" posx="200", posy="0">60</square>
</build>