Telerik MVC 图 - 形状位置

Question

我的应用程序是 MVC5，我正在使用以下内容来编辑 Telerik 图；但是，无法保存任何矩形的位置。 FromPointX（所有点）不发送到控制器。

function visualTemplate(options) {
        var dataviz = kendo.dataviz;
        var g = new dataviz.diagram.Group();
        var dataItem = options.dataItem;
        if (dataItem.Initialsource === true) {
            g.append(new dataviz.diagram.Circle({
                radius: 60,
                stroke: {
                    width: 2,
                    color: dataItem.Color || "#586477"
                },
                fill: "#e8eff7"
            }));
        } else {
            g.append(new dataviz.diagram.Rectangle({
                width: 240,
                height: 67,
                stroke: {
                    width: 0
                },
                fill: "#e8eff7" 
            }));
            g.append(new dataviz.diagram.Rectangle({
                width: 8,
                height: 67,
                fill: dataItem.Color,
                stroke: {
                    width: 0
                }
            }));
        }
        return g;
    }
    function onDataBound(e) {
        var that = this;
        setTimeout(function () {
            that.bringIntoView(that.shapes);
        }, 0);
    }



@(Html.Kendo().Diagram<OrgChartShape, OrgChartConnection>()
                  .Name("diagram") 
                  .Editable(editable =>
                  {
                      editable.ShapeTemplateName("DiagramEditor");
                  })
                  .DataSource(d => d
                      .ShapeDataSource()
                      .Model(m =>
                      {
                          m.Id(s => s.Id);
                          m.Field(s => s.Id).Editable(false);
                          m.Field(s => s.FirstName);
                          m.Field(s => s.LastName);
                          m.Field(s => s.Color);
                          m.Field(s => s.MeetingLocation);
                          m.Field(s => s.PHN);
                          m.Field(s => s.Phone);
                          m.Field(s => s.Email);
                          m.Field(s => s.Contacted);
                      })
                      .Read("ReadShapes", "DiagramData")
                      .Create("CreateShape", "DiagramData")
                      .Destroy("DestroyShape", "DiagramData")
                      .Update("UpdateShape", "DiagramData")
                  )
                  .ConnectionsDataSource(d => d
                      .Model(m =>
                      {
                          m.Id(c => c.Id);
                          m.Field(c => c.Id).Editable(false);
                          m.Field(c => c.Text).Editable(false);
                          m.From(c => c.FromShapeId);
                          m.To(c => c.ToShapeId);
                          m.FromX(c => c.FromPointX);
                          m.FromY(c => c.FromPointY);
                          m.ToX(c => c.ToPointX);
                          m.ToY(c => c.ToPointY);
                      })
                      .Read("ReadConnections", "DiagramData")
                      .Create("CreateConnection", "DiagramData")
                      .Destroy("DestroyConnection", "DiagramData")
                      .Update("UpdateConnection", "DiagramData")
                  )
                  .Events(e => e.DataBound("onDataBound"))
                  .Layout(l => l
                      .Type(DiagramLayoutType.Tree)
                      .Subtype(DiagramLayoutSubtype.Tipover)
                      .UnderneathHorizontalOffset(140)
                  )
                  .ShapeDefaults(sd => sd
                      .Visual("visualTemplate")
                      .Content(c => c
                          .Template("#= dataItem.FirstName # #= dataItem.LastName #")
                          .FontSize(17)
                      )
                  )
                  .ConnectionDefaults(cd => cd
                      .Stroke(s => s
                          .Color("#586477")
                          .Width(2)
                      )
                  )
                  .HtmlAttributes(new { style = "height: 600px;" } ))

Answer 1

我找到了解决方案：将 DiagramLayoutType 从 Tree 更改为 Layered。