//初始化绘图板
function Paper() {
var graph = new joint.dia.Graph; //生成画板
var paper = new joint.dia.Paper({ //生成画布
el: $('#display_box'),
width: 800,
height: 500,
model: graph,
gridSize: 1
});
var cell1=getShape(1);//获取图形
graph.addCells([cell1]);
}
//构建形状,可以根据条件创建
function getShape(index,addnew){
var cell;
cell=getRect(0,0,'rgb(238,244,247)','矩形',100,50);
return cell;
}
/**
* 生成矩形
* px x 坐标
* py y 坐标
* pbackground 背景色
* ptext 显示文本
* pwidth 宽带
* pheight 高度
*/
function getRect(px, py, pbackground, ptext,pwidth,pheight){
var cell = new joint.shapes.basic.Rect({
position: {
x: px,
y:py
},
size: {
width: pwidth,
height: pheight
},
attrs: {
//attr SVG attr prop- custom data
rect: {
fill:pbackground,
'stroke': 'black',
'stroke-width': '1px'
},
text: {
text: ptext,
fill: 'black'
}
}
});
return cell;
}