Kendo chart rendering very slow

↘锁芯ラ 提交于 2019-11-27 08:43:33

问题


I have kendo chart as below. I have to plot the graph which has more than 20k points. The problem i am facing here is the chart is rendering very slow. How to improve the peformance of this. Any help on this is highly appreciated?

 @(Html.Kendo().PanelBar()
                            .Name("linePanelBar")
        //.ExpandMode(PanelBarExpandMode.Multiple)
                .HtmlAttributes(new { style = "width:100%;height:300px;background-color:transparent;" })
                            .Items(panelbar =>
                            {
                                panelbar.Add().Text("Correlation")
                                .Expanded(true)
                                .Content(@<div onclick="onCell3Clicked()">
                                              <div id="loading"></div>
                                    @if (@Model != null && @Model.XValues != null && @Model.YValues != null)
                                    {
                                        @(Html.Kendo().Chart()
        .Name("Correlationchart")
            .RenderAs(RenderingMode.Canvas)
                .Transitions(false)
        .Title(Model.YString + " Vs " + Model.XString + " Relationship")
        //.Legend(legend => legend
        //    .Position(ChartLegendPosition.Right).Visible(true)
        //)
       .SeriesDefaults(seriesDefaults =>
            seriesDefaults.ScatterLine().Style(ChartScatterLineStyle.Smooth)

            )

        .Series(series =>
        {
            series.Scatter(Model.CorrelationChartData).Fields("xValue", "yValue").NoteTextField("fallback").Notes(notes => notes.Label(label => label.Position(ChartNoteLabelPosition.Outside)).Position(ChartNotePosition.Top));
            series.ScatterLine(Model.RegressionChartData).Fields("xValue", "yValue").Name("Regression");
            series.ScatterLine(Model.LowessChartData).Fields("xValue", "yValue").Name("Lowess");

        }).Events(e=>e.SelectStart("onSelectStart").SelectEnd("onSelectEnd"))
        .ChartArea(x => x.Width(600).Height(300))
        .XAxis(x => x
            .Numeric()
            .Title(title => title.Text(Model.XString))
            .Crosshair(crosshair => crosshair
                .Visible(true)
                .Tooltip(tooltip => tooltip
                    .Visible(true)
                )
             )
        )
        .YAxis(y => y
            .Numeric()
            .Title(title => title.Text(Model.YString))
            .AxisCrossingValue(-5)
            .Crosshair(crosshair => crosshair
                .Visible(true)
                .Tooltip(tooltip => tooltip
                    .Visible(true)
                )
            )
        )
                                        )

                                    }
                                </div>);
                            }))

Thanks

来源:https://stackoverflow.com/questions/34334829/kendo-chart-rendering-very-slow

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!