消防站错误："Nested arrays are not supported"。消防仓库/p5.js问题

Question

有人能帮我更好地理解这个错误吗？我正试图使用p5.js和firebase/firestore来创建一个网站，在那里你可以在画布上画一个东西，然后它将绘图保存到firestore，但当我点击保存时，我会收到以下错误：

error.ts:166未捕获的FirebaseError:Function DocumentReference.set((调用时使用了无效数据。不支持嵌套阵列

到目前为止我的代码：

var drawing = [];
var currentPath = [];
var isDrawing = false;
function setup() {
canvas = createCanvas(400,400);
canvas.mousePressed(startPath);
canvas.parent('canvas');
canvas.mouseReleased(endPath);
var saveButton = select('#saveButton');
saveButton.mousePressed(saveDrawing);
}
function startPath() {
isDrawing = true;
currentPath = [];
drawing.push(currentPath);
}
function endPath() {
isDrawing = false;
}
function draw() {
background(0);
if (isDrawing){
var point = {
x: mouseX,
y: mouseY
}
currentPath.push(point);
}
stroke(255);
strokeWeight(7);
noFill();
for (var i = 0; i < drawing.length; i++) {
var path = drawing[i];
beginShape();
for (var k = 0; k < path.length; k++) {
vertex(path[k].x, path[k].y)
}
endShape();
}
}
function saveDrawing(){
db.collection('joonistused').add({
drawing: drawing
});
var result = ref.push(data, dataSent);
console.log(result.key)
function dataSent(status) {
console.log(status);
}
}

编辑：如何将数组中的图形坐标存储到firestore？比如把我的画存到消防仓库？

Answer 1

实际上，drawing是一个数组，其中直接项也是数组。由于某些技术限制，Firebase似乎不允许拥有阵列阵列。

StackOverflow上这个类似问题的答案表明，你仍然可以间接地拥有数组数组，正如Troy Michael所说：

您可以调整一个序列化函数，该函数将具有对象类型的数组转换为映射。键可以是数字键以维持秩序。

即｛1:对象，2:对象2…｝

在反序列化时，您可以获得Object.values(data(；将其放回要在客户端使用的数组中。

您可以这样做，或者简单地将子数组嵌套到对象中，其中drawing与[ { items: [ ... items of array ...] }, ... ]类似。现在请注意，drawing是一个对象数组，其中每个对象都有一个名为items的字段，它是一个项数组。根据引用的问题，这似乎足以解决限制。