编辑
“关系图”提供了编辑选项，使您能够向其添加工具和形状，并使用其布局选项。
开始
要启用图表的编辑功能:
为远程CRUD操作配置数据源。
var dataSource =新的kendo.data。数据源({传输:{读取:{url: "/DiagramShapes"， dataType: "jsonp"}，更新:{url: "/DiagramShapes/更新"，dataType: "jsonp"}，销毁:{url: "/DiagramShapes/销毁"，dataType: "jsonp"}，创建:{url: "/DiagramShapes/创建"，dataType: "jsonp"}， //…}});配置
connectionsDataSource用于远程CRUD操作。没有设置ConnectionsDataSource，关闭编辑功能。var connectionsDataSource =新的kendo.data。数据源({传输:{读取:{url: "/DiagramConnections"， dataType: "jsonp"}，更新:{url: "/DiagramConnections/ update "， dataType: "jsonp"}，销毁:{url: "/DiagramConnections/销毁"，dataType: "jsonp"}，创建:{url: "/DiagramConnections/ create "， dataType: "jsonp"}， //…}});属性声明字段定义
模式数据源的。var dataSource =新的kendo.data。数据源({/ / . .model: {id: "id"， fields:{//该字段不可编辑。缺省值为true。id: {from:“id”，type:“number”，可编辑:false}， JobTitle: {type:“string”}，Color: {type:“string”}}}});属性声明字段定义
模式的connectionsDataSource．var connectionsDataSource =新的kendo.data。数据源({/ / . .model: {id: "id"， fields:{//该字段不可编辑。缺省值为true。id:{来自:“id”，类型:“number”，可编辑:false}，来自:{来自:“FromShapeId”，类型:“number”}，到:{来自:“ToShapeId”，类型:“number”}，fromX:{来自:“FromPointX”，类型:“number”}，frommy:{来自:“FromPointY”，类型:“number”}，toX:{来自:“ToPointX”，类型:“number”}，toY:{来自:“ToPointX”，类型:“number”}}}});通过配置工具栏启用插入新记录。的
createShape默认添加。$(" #图”)。kendoDiagram({dataSource: dataSource, connectionsDataSource: connectionsDataSource, editable: {tools: ["createShape"， "createConnection"]}});通过添加删除工具来启用记录的删除。
$(" #图”)。kendoDiagram({dataSource: dataSource, connectionsDataSource: connectionsDataSource, editable: {tools: ["delete"]}});
模型领域
形状模型
形状模型提供了以下字段:
id(Number) -一个必填字段。表示形状的唯一标识符。一个没有id字段将不会被连接。类型(字符串)-形状类型。文本(字符串)-形状文本。x(数量)- - -x形状的位置。y(数量)- - -y形状的位置。宽度(数字)-形状宽度。高度(数字)-形状高度。
每个形状模型字段在用户交互时更新。
下面的示例演示了DataSource模型定义。
schema: {model: {id: "id"， //形状的"id"就是"id"字段。强制性的。{//描述形状字段并将它们映射到远程服务返回的字段。id: {// 'id'服务器端字段映射到'id'客户端字段。from: "Id"， type: "number"}， text: {// 'text'服务器端字段映射到'text'客户端字段。from: "Text"， type: "string"}， type: {// 'type'服务器端字段映射到'type'客户端字段。from: "Type"， Type: "string"}， x: {// 'x'服务器端字段映射到'x'客户端字段。from: "X"， type: "number"}， y:{//服务器端'y'字段映射到客户端'y'字段。from: "Y"， type: "number"}， width: {// 'width'服务器端字段被映射到'width'客户端字段。from: "Width"， type: "number"}， height: {// 'height'服务器端字段被映射到'height'客户端字段。 from: "Height", type: "number" } } } }连接模型
连接模型提供以下字段:
id(Number) -连接的唯一标识符。文本(字符串)-连接文本。从(数字)-形状的联系id．来(数字)-形状的联系id．fromX(Number) -连接从x的位置。如果从，则不应用此位置。fromY(Number) -连接从y的位置。如果从，则不应用此位置。托克斯(数字)-连接到x的位置。如果从，则不应用此位置。玩具(数字)-连接到y的位置。如果从，则不应用此位置。fromConnector(字符串)-源形状连接器的名称。toConnector(字符串)-目标形状连接器的名称。
每个连接模型字段在用户交互时更新。
下面的示例演示connectionsDataSource模型定义。
schema: {model: {id: "id"， //连接的"id"是"id"字段。{//描述连接字段并将它们映射到远程服务返回的字段。id: {// 'id'服务器端字段映射到'id'客户端字段从:" id "， type: "number"}， text: {// 'text'服务器端字段映射到'text'客户端字段。from: "Text"， type: "string"}， from: {// 'from'服务器端字段映射到'from'客户端字段。from: " from "， type: "number"}， fromX: {// 'fromX'服务器端字段映射到'fromX'客户端字段。from: "FromX"， type: "number"}， fromY: {// 'fromY'服务器端字段映射到'fromY'客户端字段。from: "FromY"， type: "number"}， to:{//服务器端" to "字段映射到客户端" to "字段。from: "To"， type: "number"}， toX: {// 'toX'服务器端字段映射到'toX'客户端字段。from: "ToX"， type: "number"}， toY: {// 'toY'服务器端字段映射到'toY'客户端字段。from: "ToY"， type: "number"}， fromConnector: {// 'fromConnector'服务器端字段被映射到'fromConnector'客户端字段。 from: "FromConnector", type: "string" }, toConnector: { // The 'ToConnector' server-side field is mapped to the 'toConnector' client-side field. from: "ToConnector", type: "string" } } } }