data: function() {
return {
width: "100%",
height: "499px",
nodes: [
// create node
createNode("firstRectangle",400,200,500,300,""),
createNode("Image",100,100,400,300,"Image"),
createNode("MyNode",200,60,600,300,"MyNode"),
createNode("A",20,20,310,210,"A"),
createNode("B",20,20,310,410,"B"),
createNode("C",20,20,500,410,"C"),
createNode("D",20,20,690,410,"D"),
// Grouping nodes into a single group
{
id: 'group',
style:{
fill:'transparent',
strokeWidth:0
},
// set an node id to children collection
children: ['firstRectangle', 'Image', 'MyNode', 'A', 'B', 'C', 'D']
}
]
};
},
//create node
function createNode(id, width, height, offsetX, offsetY, content) {
var node = {};
node.id = id;
node.width = width;
node.height = height;
node.offsetX = offsetX;
node.offsetY = offsetY;
node.annotations = [{content: content}];
return node;
} |