Xamarin微图表“ Flink ”

ecbunoof  于 2022-12-07  发布在  Flink
关注(0)|答案(1)|浏览(140)

我在Xamarin上使用Microchart,我在图表上可视化来自蓝牙温度传感器的数据,但每次我更新数据时,组件都会从0到值重新绘制所有数据,因此效果是一个 Flink 的图表:
检视

<microcharts:ChartView  x:Name="chartV"  BackgroundColor="Transparent"  
    RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.02}"
    RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor={x:OnPlatform Android=0.4, iOS=0.4}}" 
    RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.96}"
    RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.245}"
/>

查看模型

private void Bt_ParametersList(List<Com.PAR> parameters, Com.unit UNIT)
{
    Dispatcher.BeginInvokeOnMainThread(new Action(delegate
    {
        if (voltData.Count < graph_Hmax_span)
        {
            voltData.Add(UNIT.OUTPUT_VOLTAGE);
        }
        else
        {
            voltData.Add(UNIT.OUTPUT_VOLTAGE);
            voltData.RemoveAt(0);
        }
        var chartVoltage = new List<ChartEntry>();

        UInt16 counter = 0;
        foreach (var data in voltData)
        {
            chartVoltage.Add(new ChartEntry((float)data)
            {
                ValueLabel = data.ToString(),
                Color = SKColor.Parse("#FF1943"),
                Label = counter.ToString()
            });
            counter++;
        }
        chartV.Chart = new LineChart()
        {
            Entries = chartVoltage,
            IsAnimated = false,
            AnimationProgress = 0,
            AnimationDuration = new TimeSpan(0),
            MaxValue = v_max,
            MinValue = 0,
            LabelTextSize = 25,
            LabelOrientation = Orientation.Horizontal,
            LineSize = 3,
        };
    }));
}

这个函数是从一个接收事件中调用的,我使用了一个类似移位寄存器的列表,添加最后一个,删除第一个,然后为组件创建一个数据。
每次更新数据时,组件都会从0到目标值重新绘制所有数据,结果是从0到X的一条线。有解决方法吗?我在网上搜索过,但没有,结果很好。或者可能是一种方法,在组件中添加一个新点并删除第一个数据,而不是从外部列表中删除。

ghhaqwfi

ghhaqwfi1#

Well, the "blink" is actually your control being redrawn, Micro charts use Skia for the charts which means that when you assign a new line chart it will obviously get drawn from scratch.
Instead of doing something like:

chartV.Chart = new LineChart()
    {
        Entries = chartVoltage,
        IsAnimated = false,
        AnimationProgress = 0,
        AnimationDuration = new TimeSpan(0),
        MaxValue = v_max,
        MinValue = 0,
        LabelTextSize = 25,
        LabelOrientation = Orientation.Horizontal,
        LineSize = 3,
    };

And redrawing the whole thing just assign the Entries again on the existing chart.
So your code would look like this :

chartV.Chart.Entries= chartVoltage;

Also, most of that code does not need to be on MainThread so remove it and only apply it where it's necessary.

相关问题