WPF ScottPlot绘曲线,Y轴可选择温度或是温度,实现MVVM
时间: 2024-03-09 18:48:24 浏览: 654
可以通过以下步骤实现:
1. 安装ScottPlot和ScottPlot.WPF包。
2. 在ViewModel中定义绑定的数据源,包括X轴和Y轴的数据。同时,定义绑定的属性,如是否显示网格线、是否显示图例等。
3. 在View中,使用ScottPlot.WPF中的WpfPlot控件来展示绘图结果。使用绑定来指定ViewModel中的属性,如绑定数据源、绑定是否显示网格线等。
4. 在ViewModel中,添加控制Y轴单位的属性。在绑定数据源时,使用这个属性来决定Y轴的单位。
下面是一个示例代码,仅供参考:
ViewModel:
```csharp
public class MainViewModel : INotifyPropertyChanged
{
private List<double> _xData;
private List<double> _yData;
private bool _showGridLines;
private bool _showLegend;
private string _yAxisLabel;
private bool _isCelsius;
public MainViewModel()
{
// 初始化数据源
_xData = new List<double> { 0, 1, 2, 3, 4 };
_yData = new List<double> { 20, 22, 23, 21, 19 };
_showGridLines = true;
_showLegend = true;
_yAxisLabel = "Temperature (℃)";
_isCelsius = true;
}
public List<double> XData
{
get { return _xData; }
set
{
_xData = value;
OnPropertyChanged(nameof(XData));
}
}
public List<double> YData
{
get { return _yData; }
set
{
_yData = value;
OnPropertyChanged(nameof(YData));
}
}
public bool ShowGridLines
{
get { return _showGridLines; }
set
{
_showGridLines = value;
OnPropertyChanged(nameof(ShowGridLines));
}
}
public bool ShowLegend
{
get { return _showLegend; }
set
{
_showLegend = value;
OnPropertyChanged(nameof(ShowLegend));
}
}
public string YAxisLabel
{
get { return _yAxisLabel; }
set
{
_yAxisLabel = value;
OnPropertyChanged(nameof(YAxisLabel));
}
}
public bool IsCelsius
{
get { return _isCelsius; }
set
{
_isCelsius = value;
// 根据选择来更新Y轴标签
YAxisLabel = _isCelsius ? "Temperature (℃)" : "Temperature (℉)";
OnPropertyChanged(nameof(IsCelsius));
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propertyName)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
```
View:
```xml
<Window x:Class="ScottPlotDemo.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:ScottPlotDemo"
xmlns:wpf="clr-namespace:ScottPlot.WPF;assembly=ScottPlot.WPF"
Title="ScottPlot Demo" Height="450" Width="800">
<Window.DataContext>
<local:MainViewModel />
</Window.DataContext>
<Grid>
<wpf:WpfPlot Margin="10" ShowGridLines="{Binding ShowGridLines}" ShowLegend="{Binding ShowLegend}">
<wpf:WpfPlot.AxisX Label="Time (s)" />
<wpf:WpfPlot.AxisY Label="{Binding YAxisLabel}" />
<wpf:WpfPlot.LinePlot Title="Temperature" X="{Binding XData}" Y="{Binding YData}" />
</wpf:WpfPlot>
<RadioButton Content="℃" HorizontalAlignment="Left" Margin="30,380,0,0" VerticalAlignment="Top" IsChecked="{Binding IsCelsius, Mode=TwoWay}" />
<RadioButton Content="℉" HorizontalAlignment="Left" Margin="80,380,0,0" VerticalAlignment="Top" IsChecked="{Binding IsCelsius, Converter={StaticResource InverseBooleanConverter}, Mode=TwoWay}" />
</Grid>
</Window>
```
其中,使用了一个名为InverseBooleanConverter的转换器,用于将bool类型的值取反。需要在Window的Resources中定义该转换器:
```xml
<Window.Resources>
<local:InverseBooleanConverter x:Key="InverseBooleanConverter" />
</Window.Resources>
```
InverseBooleanConverter的代码:
```csharp
public class InverseBooleanConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
if (value is bool boolValue)
{
return !boolValue;
}
return Binding.DoNothing;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
if (value is bool boolValue)
{
return !boolValue;
}
return Binding.DoNothing;
}
}
```
通过以上代码,便实现了一个可以切换Y轴单位的ScottPlot曲线图,并且使用了MVVM模式进行开发。
阅读全文