firestore error:"Nested arrays are not supported". Firestore/p5.js problem

firestore error:"Nested arrays are not supported". Firestore/p5.js problem

有人可以帮助我更好地理解这个错误吗?我正在尝试使用 p5.js 和 firebase/firestore 创建一个站点,您可以在其中在 canvas 上绘制一些东西,然后将绘图保存到 firestore,但是当我单击保存时,然后我收到此错误:

error.ts:166 Uncaught FirebaseError: Function DocumentReference.set() called with invalid data. Nested arrays are not supported

到目前为止我的代码:

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?喜欢将我的绘图保存到 Firestore 中吗?

其实drawing是一个数组,直接项也是数组。由于某些技术限制,Firebase 似乎不允许使用数组数组。

这个 state that you still can have array of arrays indirectly, as stated by 的答案:

You could adapt a serialization function that converts arrays with object types into a map. The keys can be numeric to maintain order.

i.e. { 1: Object, 2: Object2 ... }

On deserialization you can get the Object.values(data); to put it back into an array to be used client-side.

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