C#-WPF-控件-LiveChart线性图表

LiveChart线性图表

目录

常用属性和设置

实例

1.下载插件

2.简单实例

实例

1.下载插件

2.简单实例

注意 xmlns:lvc="clr-namespace:LiveCharts.Wpf;assembly=LiveCharts.Wpf"

MainWindow.axml <Window x:Class="WpfControl_LiveCharts.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:WpfControl_LiveCharts" xmlns:lvc="clr-namespace:LiveCharts.Wpf;assembly=LiveCharts.Wpf" //*注意 mc:Ignorable="d" Title="MainWindow" Height="450" Width="800"> <Grid ShowGridLines="True" Background="#FFF3F3EF"> <Grid.RowDefinitions> <RowDefinition Height="1*"></RowDefinition> </Grid.RowDefinitions> <lvc:CartesianChart Grid.Row="1" Margin="5" Series="{Binding seriesCollection}" Background="#FFF8FCFD"> //*注意 <lvc:CartesianChart.AxisY> <lvc:Axis Title=" 电压" Foreground="DarkRed" FontSize="10"></lvc:Axis> </lvc:CartesianChart.AxisY> <lvc:CartesianChart.AxisX> <lvc:Axis Title="时间" Foreground="DarkRed" FontSize="10"></lvc:Axis> </lvc:CartesianChart.AxisX> </lvc:CartesianChart> </Grid> </Window>

namespace WpfControl_LiveCharts { public partial class MainWindow : Window { public SeriesCollection seriesCollection { get; set; } public MainWindow() { InitializeComponent(); seriesCollection = new SeriesCollection { //显示第1条数据 线性 new LineSeries { Values = new ChartValues<double> { 20, 40, 60, 30 }}, //显示第2条数据 线性 new LineSeries { Values = new ChartValues<double> { 30.3, 50.5, 70.7, 40.4 }}, //显示第3条数据 圆柱 new ColumnSeries{ Values = new ChartValues<decimal> { 20, 24, 8, 28 }}, //显示第4条数据 圆柱 new ColumnSeries{ Values = new ChartValues<decimal> { -50, -10, -30, -28}} }; DataContext = this; } //================================================== } }

效果