时间戳

首页 > 解决方案 > 实时图表中的视觉元素？

c# - 实时图表中的视觉元素？

问题描述

我想在 5 秒的时间跨度内将一条垂直线从笛卡尔图表的开头移动到结尾。我尝试查看网站https://lvcharts.net/App/examples/v1/wpf/Visual%20Elements中提供的示例，但图中的 UI 元素与代码不匹配。

当我尝试将线条直接添加到图表时，线条工作正常，但图表未显示。

<lvc:CartesianChart Name="CartChart" Height="150" Zoom="Xy" Pan="Xy">

    <lvc:CartesianChart.Series>
        <lvc:LineSeries Values="{Binding audioPoints}" StrokeThickness="1" PointGeometry="{x:Null}" Visibility="Visible" />
    </lvc:CartesianChart.Series>

    <Line x:Name="anotherLine" Stroke="Black" Height="160" X1="0"X2="0" Y1="0" Y2="160"/>

</lvc:CartesianChart>

标签： c#livecharts

解决方案

我发现了这个代码示例，我认为它将演示您需要做什么。您应该能够将其中的大部分转换为数据绑定和 xaml。

需要注意的重要一点是，您将 VisualElement 添加到 CartesianChart 上的 VisualElements 集合中。您将 VisualElement 对象上的 UIElement 属性设置为要添加到图表中的 WPF 控件。

https://lvcharts.net/App/examples/v1/wf/Visual%20Elements

    cartesianChart1.VisualElements.Add(new VisualElement
    {
        X = 0.5,
        Y = 7,
        HorizontalAlignment = HorizontalAlignment.Center,
        VerticalAlignment = VerticalAlignment.Top,
        UIElement = new TextBlock //notice this property must be a wpf control
        {
            Text = "Warning!",
            FontWeight = FontWeights.Bold,
            FontSize = 16,
            Opacity = 0.6
        }
    });

    cartesianChart1.VisualElements.Add(new VisualElement()
    {
            X=0,
            Y=myCalculatedValue,
            UIElement = new Rectangle()
            {
                Width= width,
                Margin= new Thickness(-seriesWidth/2, 0, 0, 0),
                Height=6,
                Fill=Brushes.Black,
                VerticalAlignment = VerticalAlignment.Top
            }
    });

推荐阅读