一. 背景问题
在WPF中使用LiveCharts做柱状态、折线图之类的图标时,有时候发现有些样式的设定没有提供接口。
比如,下面这个柱状图 左侧的图标Backgroud ,想把这个 红色背景色和 蓝色背景色 变为透明的,把字变为红色和蓝色。结果发现 LiveCharts 没有提供这个背景色属性设定接口。
二. 解决方法
-
从LiveCharts的github上下载代码。
https://github.com/Live-Charts/Live-Charts -
修改AxisSection.cs的代码
...省略...
/// <summary>
/// The data label brush property
/// </summary>
public static readonly DependencyProperty DataLabelForegroundProperty = DependencyProperty.Register(
"DataLabelForeground", typeof(Brush), typeof(AxisSection), new PropertyMetadata(default(Brush)));
/// <summary>
/// Gets or sets the data label brush.
/// </summary>
/// <value>
/// The label brush.
/// </value>
public Brush DataLabelForeground
{
get { return (Brush) GetValue(DataLabelForegroundProperty); }
set { SetValue(DataLabelForegroundProperty, value); }
}
// ↓↓↓↓↓↓↓↓添加的代码↓↓↓↓↓↓↓↓↓↓
/// <summary>
/// The data label brush property
/// </summary>
public static readonly DependencyProperty DataLabelBackgroundProperty = DependencyProperty.Register(
"DataLabelBackground", typeof(Brush), typeof(AxisSection), new PropertyMetadata(default(Brush)));
/// <summary>
/// Gets or sets the data label brush.
/// </summary>
/// <value>
/// The label brush.
/// </value>
public Brush DataLabelBackground
{
get { return (Brush)GetValue(DataLabelBackgroundProperty); }
set { SetValue(DataLabelBackgroundProperty, value); }
}
// ↑↑↑↑↑↑↑↑↑添加的代码↑↑↑↑↑↑↑↑↑↑↑
...省略...
/// <summary>
/// Draws the or move.
/// </summary>
/// <param name="source">The source.</param>
/// <param name="axis">The axis.</param>
public void DrawOrMove(AxisOrientation source, int axis)
{
...省略...
// ↓↓↓↓↓↓↓↓修改的代码↓↓↓↓↓↓↓↓↓↓
//_label.Background = Stroke ?? Fill;
if (DataLabelBackground != null)
{
_label.Background = DataLabelBackground;
}
else
{
_label.Background = Stroke ?? Fill;
}
// ↑↑↑↑↑↑↑↑↑修改的代码↑↑↑↑↑↑↑↑↑
...省略...
-
在Visual Studio中编译代码。只编译 WpfView 就可以。
-
把编译结果LiveCharts.dll和LiveCharts.Wpf.dll 复制到自己工程底下 覆盖掉 原来的 dll,使用即可。
主要 就是 使用 添加的 属性 DataLabelBackground=“Transparent”
<lvc:AxisSection Value="{Binding YMaxSection, Mode=TwoWay}"
DataLabel="True"
DataLabelForeground="Red"
DataLabelBackground="Transparent"
StrokeThickness="1"
StrokeDashArray="10"
Stroke="Red"
Panel.ZIndex="99" />
<lvc:AxisSection Value="{Binding YMinSection, Mode=TwoWay}"
DataLabel="True"
DataLabelForeground="Blue"
DataLabelBackground="Transparent"
StrokeThickness="1"
StrokeDashArray="10"
Stroke="Blue"
Panel.ZIndex="99" />
执行效果 基本是这个样子。