WPF livecharts 折线图遮挡数字问题

在WPF里使用livecharts,如果折线图或者柱状图有多个的时候,可能会出现两个数字遮挡问题,这时候要设置DataLabelsTemplate 属性。

如LineSeries设置代码如下:

第一个折线图的DataLabelsTemplate

cs 复制代码
var stackPanelFactory = new FrameworkElementFactory(typeof(StackPanel));
stackPanelFactory.SetValue(StackPanel.OrientationProperty, Orientation.Horizontal);
var textBlockFactoryA = new FrameworkElementFactory(typeof(TextBlock));
textBlockFactoryA.SetValue(TextElement.ForegroundProperty, new SolidColorBrush((System.Windows.Media.Color)System.Windows.Media.ColorConverter.ConvertFromString("#5BABEF")));
textBlockFactoryA.SetBinding(TextBlock.TextProperty, new Binding("FormattedText"));
textBlockFactoryA.SetValue(TextBlock.MarginProperty, new Thickness(0, 0, 0, -8));
stackPanelFactory.AppendChild(textBlockFactoryA);
var dataTemplate = new DataTemplate() { VisualTree = stackPanelFactory };

第二个折线图的DataLabelsTemplate

cs 复制代码
 var stackPanelFactory2 = new FrameworkElementFactory(typeof(StackPanel));
 stackPanelFactory2.SetValue(StackPanel.OrientationProperty, Orientation.Horizontal);
 var textBlockFactoryA2 = new FrameworkElementFactory(typeof(TextBlock));
 textBlockFactoryA2.SetValue(TextElement.ForegroundProperty, new SolidColorBrush(Colors.White));
 textBlockFactoryA2.SetBinding(TextBlock.TextProperty, new Binding("FormattedText"));
 textBlockFactoryA2.SetValue(TextBlock.MarginProperty, new Thickness(0, 0, 0, -40));
 stackPanelFactory2.AppendChild(textBlockFactoryA2);
 var dataTemplate2 = new DataTemplate() { VisualTree = stackPanelFactory2 };

设置LineSeries

cs 复制代码
Func<double, string> Formatter;
SeriesCollection = new SeriesCollection
{
    new LineSeries
    {
        Title = "",
        DataLabels=true,
        //注意设置在这里
        DataLabelsTemplate= dataTemplate,
        Values = inValueList,
        Stroke=new SolidColorBrush((System.Windows.Media.Color)System.Windows.Media.ColorConverter.ConvertFromString("#5BABEF")),
        Foreground= new SolidColorBrush((System.Windows.Media.Color)System.Windows.Media.ColorConverter.ConvertFromString("#5BABEF")),
        FontSize=26,
    },
    new LineSeries
    {
        Title="",
        DataLabels=true,
        //注意设置在这里
        DataLabelsTemplate= dataTemplate2,
        Values= outValueList,
        Stroke =new SolidColorBrush(Colors.White),
        Foreground= new SolidColorBrush(Colors.White),
        FontSize=26,
    },

};

Formatter = value => value.ToString("N");
lvcWeekLabel.Labels = Labels;
lvcWeekLabel.LabelFormatter = Formatter;
lvcWeek.Series = SeriesCollection;

具体位置可能要根据你的图表大小调整,主要就是调整

textBlockFactoryA2.SetValue(TextBlock.MarginProperty, new Thickness(0, 0, 0, -40));

这句话。另外字体大小什么的也可以根据需求调整

相关推荐
小满Autumn12 分钟前
依赖注入设计模式速查手册
开发语言·c#·wpf·mvvm·依赖注入
Xin_ye100861 小时前
C# 零基础到精通教程 - WPF 专题三:高级控件与自定义控件
开发语言·c#·wpf
Xin_ye100863 小时前
C# 零基础到精通教程 - WPF 深度专题:自定义布局与性能优化
开发语言·c#·wpf
小满Autumn4 小时前
WPF 依赖属性速查手册
笔记·c#·wpf·上位机·mvvm
Xin_ye100864 小时前
C# 零基础到精通教程 - WPF 深度专题:3D 图形与视觉增强
开发语言·c#·wpf
加号31 天前
【WPF】 自定义 Image 控件实现图像缩放与平移
wpf
闪电悠米1 天前
黑马点评-分布式锁-02_simple_redis_lock_setnx
java·数据库·spring boot·redis·分布式·缓存·wpf
闪电悠米1 天前
黑马点评-分布式锁-03_lua_atomic_unlock
java·数据库·分布式·缓存·oracle·wpf·lua
多巴胺耐受2 天前
【WPF】炫酷的科技报警弹窗
科技·c#·wpf
Xin_ye100862 天前
C# 零基础到精通教程 - WPF 专题二:数据绑定与 MVVM
开发语言·c#·wpf