This is a migrated thread and some comments may be shown as answers.

Diagram does not work on Internet Explorer (IE)

2 Answers 32 Views
Diagram
This is a migrated thread and some comments may be shown as answers.
Sanjukta
Top achievements
Rank 1
Sanjukta asked on 21 Aug 2018, 08:58 PM

Hi Team,

             I have a simple MVC diagram, which works on Chrome but throws error on Internet Explorer. I do not have a clue. Please find the code below in Razor View. Please help.

It says onDataBound is undefined and cannot find property bringIntoView.

 

@model dotGrantsApps.Areas.Maintenance.Models.WorkflowViewModel
@using Kendo.Mvc.UI
@{
    ViewBag.Title = "Workflow Chart";
    @Html.Hidden("hdnWorkflowId", Model.OtcId);
}

@(Html.Kendo().Diagram()
                                    .Name("workflowOverviewDiagram")
                                    .DataSource(dataSource => dataSource
                                    .Read(read => read.Action("GetWorkflowStopData", "WorkflowMaintenance", new { area = "Maintenance", workflowDefinitionId = Model.OtcId }))
                                    .Model(m => m.Children("Items"))
                                    )
                                    .Editable(false)
                                    .Layout(l => l
                                                .HorizontalSeparation(400)
                                                .VerticalSeparation(200)
                                                .Type(DiagramLayoutType.Tree).Subtype(DiagramLayoutSubtype.Down)
                                    )
                                    .ShapeDefaults(sd => sd.Visual("visualTemplate"))
                                    .ConnectionDefaults(cd => cd
                                        .EndCap("ArrowEnd")
                                        .Stroke(s => s
                                        .Color("#979797")
                                        .Width(2)
                                    )
                                    )
                                    .ZoomRate(0)
                                    .Selectable(false)
                                    .Events(events => events.DataBound("onDataBound"))

)

<script>
        function visualTemplate(options) {
            var dataviz = kendo.dataviz;
            var g = new dataviz.diagram.Group();
            var dataItem = options.dataItem;
            var layout = new dataviz.diagram.Layout(new dataviz.diagram.Rect(0, 0, 210, 75), {
                alignContent: "center",
                spacing: 4
            });
            g.append(new dataviz.diagram.Rectangle({
                width: 210,
                height: 75,
                stroke: {
                    width: 0
                },
                fill: {
                    gradient: {
                        type: "linear",
                        stops: [{
                            color: "#133781"
                        }]
                    }
                }
            }));
            g.append(layout);
            var texts = dataItem.WorkflowStopName.split(" ");
            for (var i = 0; i < texts.length; i++) {
                layout.append(new dataviz.diagram.TextBlock({
                    text: ' ' + texts[i],
                    color: "#fff"
                }));
            }
            layout.reflow();
            return g;
        }
        function onDataBound() {
            this.bringIntoView(this.shapes);
        }
    </script>

 

 

2 Answers, 1 is accepted

Sort by
0
Sanjukta
Top achievements
Rank 1
answered on 21 Aug 2018, 09:04 PM
And also visualTemplate is undefined.
0
Sanjukta
Top achievements
Rank 1
answered on 22 Aug 2018, 06:21 PM
I just resolved it, its not related to Kendo. Thanks anyways.
Tags
Diagram
Asked by
Sanjukta
Top achievements
Rank 1
Answers by
Sanjukta
Top achievements
Rank 1
Share this question
or