首页 > 解决方案 > Telerik 图表 UI 很慢,有 1000 个值

问题描述

所以,我有一个带有 Telerik 图表的简单 xaml (UWP) 页面:

<Grid>
        <telerikChart:RadCartesianChart Background="Beige" >
            <telerikChart:RadCartesianChart.Behaviors>
                <telerikChart:ChartPanAndZoomBehavior   ZoomMode="Both" PanMode="Both"/>
                <telerikChart:ChartTooltipBehavior  />
            </telerikChart:RadCartesianChart.Behaviors>
            <telerikChart:RadCartesianChart.VerticalAxis>
                <telerikChart:LinearAxis Padding="0" Title=" (m/s/s)"  Foreground="Black"/>
            </telerikChart:RadCartesianChart.VerticalAxis>
            <telerikChart:RadCartesianChart.HorizontalAxis>
                <telerikChart:LinearAxis Title="Time (s)" Foreground="Black"/>
            </telerikChart:RadCartesianChart.HorizontalAxis>
            <telerikChart:RadCartesianChart.Grid>
                <telerikChart:CartesianChartGrid MajorLinesVisibility="XY"/>
            </telerikChart:RadCartesianChart.Grid>



            <telerikChart:ScatterLineSeries   ItemsSource="{x:Bind Values, Mode=OneWay}">
                <telerikChart:ScatterLineSeries.XValueBinding>
                    <telerikChart:PropertyNameDataPointBinding PropertyName="XValue" />
                </telerikChart:ScatterLineSeries.XValueBinding>
                <telerikChart:ScatterLineSeries.YValueBinding>
                    <telerikChart:PropertyNameDataPointBinding PropertyName="YValue" />
                </telerikChart:ScatterLineSeries.YValueBinding>
            </telerikChart:ScatterLineSeries>


        </telerikChart:RadCartesianChart>

    </Grid>

后面的代码为图表控件创建 1000 个值:

        public MainPage()
        {
            this.InitializeComponent();
            for (int i = 0; i < 1000; i++)
            {
                var val = new ValueForChart() { XValue = i, YValue = Math.Sin( i / 2d )};
                Values.Add(val);
            }
        }

        public List<ValueForChart> Values { get; set; } = new List<ValueForChart>();
//...
  public class ValueForChart
    {
        public double XValue { get; set; }
        public double YValue { get; set; }
    }

UI 渲染速度很快,但在调整窗口大小时无法用于平移、缩放或冻结。1000 个值并没有那么多......我认为RadChart应该处理更多......

难道我做错了什么?

标签: c#xamluwpteleriktelerik-charting

解决方案


推荐阅读