Error with xml file in p5js ("syntaxerror : expected ; but found table")

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: Expected ; but found table" 所以我真的迷路了...

感谢您的帮助！

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>

Error with xml file in p5js ("syntaxerror : expected ; but found table")

Error with xml file in p5js ("syntaxerror : expected ; but found table")

javascript

xml

processing

p5.js