kinetic js節能帆布舞臺

Question

我還在學習kinecticjs，想知道如何拯救cavas的狀態？

來自： http://www.html5canvastutorials.com/kineticjs/html5-canvas-save-stage-as-json-string-with-kineticjs/

 // save stage as a json string 
     var json = stage.toJSON(); 

     console.log(json); 

但我怎麼加載這個回來？謝謝

Answer 1

有一個教程here從JSON字符串加載階段。 你只需要做：

var json = '{"attrs":{"width":578,"height":200},"className":"Stage","children":[{"attrs":{},"className":"Layer","children":[{"attrs":{"x":289,"y":100,"sides":6,"radius":70,"fill":"red","stroke":"black","strokeWidth":4},"className":"RegularPolygon"}]}]}'; 

// create node using json string 
var stage = Kinetic.Node.create(json, 'container'); 

希望能回答這個問題。

Answer 2

每個對象在屬性className中引用其類名。因此，應儘可能通過JSON對象進行迭代，並做一些像

var obj = new Kinetic[node.className](node.attrs); 

使用JSON.parse()將字符串轉換成可用的對象一樣簡單。