我希望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));

最佳答案

joint.dia.Graph的API中:



因此,预期的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

10-01 19:14