在joint.js中讀取JSON？

我想joint.js圖書館閱讀我的JSON並將其顯示爲一個圖表...在joint.js中讀取JSON？

var paper = new joint.dia.Paper({ 
    el: $('#paper'), 
    width: 600, 
    height: 200, 
    model: graph 
}); 

var graph = new joint.dia.Graph; 

jsonstring = '{"employees": [ { "firstName":"John" , "lastName":"Doe" }, { "firstName":"Anna" , "lastName":"Smith" }, { "firstName":"Peter" , "lastName":"Jones" } ] }'; 

graph.fromJSON(JSON.parse(jsonstring));

來源

2013-11-20 IamMowgoud

我通過具有'fromJSON'方法不接受JSON庫好奇... – lonesomeday

有一個理由。閱讀https://developer.mozilla.org/en-US/docs/JSON#toJSON()_method和另一個庫的示例：http://backbonejs.org/#Model-toJSON。 JSON.stringify調用它遞歸地串行化的對象的JSON（）。 toJSON（）應該返回一個對象，而不是一個字符串。試試：JSON.stringify（{toJSON：function（）{return {foo：'bar'}}}）。 fromJSON（）是相反的，因此接受一個對象，而不是一個字符串。 – dave

從joint.dia.Graph的API：

joint.dia.Graph是模型持有所有圖中的單元格（鏈接元素和鏈接）。這是一個Backbone model。所有單元格的集合存儲在屬性單元格中。

所以預期的JSON應該是這樣的形式：{ cells: [] }。其中cells是一個包含元素和鏈接的數組。每個元素應該有如下形式：

{ 
    id: <string>, 
    type: '<type of shape>', 
    attrs: { <attrs> }, 
    position: { x: <int>, y: <int> }, 
    angle: <deg>, 
    size: { width: <int>, height: <int> }, 
    z: <int>, 
    ... and some other, maybe custom, data properties 
}

參考：Using Server Data with JointJS

來源

2013-11-20 13:41:21

只需添加一點，通常不需要手動構建JSON，而是通過添加JointJS元素和鏈接到圖形，然後使用JSON.stringify（圖形）對圖形進行字符串化。 – dave

在joint.js中讀取JSON？

回答

相關問題