Chciałbym móc zapisać bieżący stan kanwy do bazy danych po stronie serwera, prawdopodobnie jako łańcuch JSON, a następnie przywrócić ją za pomocąloadFromJSON. Zazwyczaj jest to łatwe do wykonania przy użyciu:

var canvas = new fabric.Canvas();
function saveCanvas() {
    // convert canvas to a json string
    var json = JSON.stringify( canvas.toJSON() );

    // save via xhr
    $.post('/save', { json : json }, function(resp){ 
        // do whatever ...
    }, 'json');
}

I wtedy

function loadCanvas(json) {

  // parse the data into the canvas
  canvas.loadFromJSON(json);

  // re-render the canvas
  canvas.renderAll();

  // optional
  canvas.calculateOffset();
}

Jednak ustawiałem również kilka atrybutów niestandardowych na obiektach z tkaninami, które dodaję do obszaru roboczego za pomocą wbudowanegoObject#set metoda:

// get some item from the canvas
var item = canvas.item(0);

// add misc properties
item.set('wizard', 'gandalf');
item.set('hobbit', 'samwise');

// save current state
saveCanvas();

Problem polega na tym, że gdy sprawdzam żądanie po stronie serwera, widzę, że moje niestandardowe atrybuty nie zostały przeanalizowane z kanwy i wysłane razem ze wszystkim innym. Ma to prawdopodobnie związek z tym, jaktoObject metoda usuwa wszystko, co nie jest atrybutem domyślnym w klasie obiektu. Jaki byłby dobry sposób na rozwiązanie tego problemu, że będę w stanie zaoszczędzić obojei przywrócić obszar roboczy z łańcucha JSON wysłanego przez serwer, a przywrócone płótno będzie również zawierać moje niestandardowe atrybuty? dzięki.