quelqu'un peut-il m'aider à mieux comprendre cette erreur? J'essaie d'utiliser p5.js et firebase / firestore pour créer un site où vous pouvez dessiner quelque chose sur la toile, puis il enregistre le dessin dans firestore, mais lorsque je clique sur enregistrer, j'obtiens cette erreur:

error.ts: 166 Uncaught FirebaseError: Fonction DocumentReference.set () appelée avec des données non valides. Les tableaux imbriqués ne sont pas pris en charge

mon code jusqu'à présent:

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

modifier: Comment puis-je stocker des coordonnées de dessin dans un tableau pour Firestore? Vous aimez enregistrer mon dessin dans un magasin de pompiers?

1
Ffic 4 nov. 2019 à 15:03

1 réponse

Meilleure réponse

En fait, drawing est un tableau où les éléments directs sont également des tableaux. Il semble que Firebase ne permette pas d'avoir des tableaux de tableaux en raison de certaines limitations techniques.

Les réponses de cette question similaire sur StackOverflow indiquer que vous pouvez toujours avoir un tableau de tableaux indirectement, comme indiqué par Troy Michael :

Vous pouvez adapter une fonction de sérialisation qui convertit des tableaux avec des types d'objets en carte. Les touches peuvent être numériques pour maintenir l'ordre.

c'est-à-dire {1: objet, 2: objet2 ...}

Lors de la désérialisation, vous pouvez obtenir les valeurs Object.values (données); pour le remettre dans un tableau à utiliser côté client.

Vous pouvez le faire de cette façon, ou simplement imbriquer vos sous-tableaux dans des objets, où drawing serait quelque chose de similaire à [ { items: [ ... items of array ...] }, ... ]. Notez maintenant que drawing est un tableau d'objets, où chaque objet a un champ nommé items, qui est un tableau d'éléments. Selon la question citée, il semble suffisant de contourner la limitation.

0
E. Zacarias 4 nov. 2019 à 12:49