LineChart上的自定义工具提示(lvChart)

时间:2018-03-05 17:14:46

标签: c# wpf livecharts

我在尝试为LineChart点构建自定义工具提示时,一步一步地按照lvChart Customizing Tooltips进行操作。但我得到空的工具提示内容。除了对ChartValues类型使用ObservableValue之外,我的代码几乎与lvChart教程中使用的代码相同。我没有使用任何MV **。

是否有人制定了教程或在LineChart上应用自定义工具提示?

LineChart and Tooltip

Main.xaml

<lvc:CartesianChart.DataTooltip>
    <local:MyTooltip />
</lvc:CartesianChart.DataTooltip>

Main.xaml.cs

MyTooltipContents = new ChartValues<MyTooltipContent>();

for (int i = 0; i < MyData.Count(); i++)
{
    MyTooltipContents.Add(new MyTooltipContent
    {
        Name = "No" + i,
        Value = "Foo"
    });     
}

var MyTooltipContentMapper = Mappers.Xy<MyTooltipContent>()
    .X((value, index) => index) 
    .Y(value => 1);          

//lets save the mapper globally
Charting.For<MyTooltipContent>(MyTooltipContentMapper);
DataContext = this;

MyTooltip.xaml

<UserControl x:Class="MyNamespace.MyTooltip"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:sys="clr-namespace:System;assembly=mscorlib"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:local="clr-namespace:MyNamespace"
             xmlns:lvc="clr-namespace:LiveCharts.Wpf;assembly=LiveCharts.Wpf"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300" 
             d:DataContext="{d:DesignInstance local:MyTooltip}"
             Background="#E4555555" Padding="20 10" BorderThickness="2" BorderBrush="#555555">

    <ItemsControl ItemsSource="{Binding Data.Points}" Grid.IsSharedSizeScope="True">
        <ItemsControl.ItemTemplate>
            <DataTemplate DataType="{x:Type lvc:DataPointViewModel}">
                <Grid Margin="2">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="Auto" SharedSizeGroup="Name"/>
                        <ColumnDefinition Width="Auto" SharedSizeGroup="Value"/>
                    </Grid.ColumnDefinitions>

                    <TextBlock Grid.Column="1" Text="{Binding ChartPoint.Instance.(local:MyTooltipContent.Name)}" 
                               Margin="5 0 0 0" VerticalAlignment="Center" Foreground="White" />

                    <TextBlock Grid.Column="2" Text="{Binding ChartPoint.Instance.(local:MyTooltipContent.Value)}" 
                               Margin="5 0 0 0" VerticalAlignment="Center" Foreground="White"/>

                </Grid>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</UserControl>

MyToolTip.xaml.cs

public partial class MyTooltip : IChartTooltip
{
    private TooltipData _data;

    public MyTooltip()
    {
        InitializeComponent();
        DataContext = this;
    }

    public event PropertyChangedEventHandler PropertyChanged;

    public TooltipData Data
    {
        get { return _data; }
        set
        {
            _data = value;
            OnPropertyChanged("Data");
        }
    }

    public TooltipSelectionMode? SelectionMode { get; set; }

    protected virtual void OnPropertyChanged(string propertyName = null)
    {
        if (PropertyChanged != null)
            PropertyChanged.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

MyTooltipContent.cs

public class MyTooltipContent
{
    public string Name { get; set; }
    public string Value { get; set; }
}

1 个答案:

答案 0 :(得分:0)

我复制了您的示例,并且对我有用。

您可能希望查看 Main.xaml.cs 上的MyTooltipContents声明,该声明应该是公共属性

    public ChartValues<MyTooltipContent> MyTooltipContents { get; set; }

我不知道是什么给了您系列行,但是我在MainWindow.xaml(对应于您的Main.xaml)上使用了这个系列:

<Window x:Class="MyToolTipExample.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:MyToolTipExample"
        xmlns:lvc="clr-namespace:LiveCharts.Wpf;assembly=LiveCharts.Wpf"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <lvc:CartesianChart LegendLocation="Right">
            <lvc:CartesianChart.Series>
                <lvc:LineSeries Title="Customers" Values="{Binding MyTooltipContents}"></lvc:LineSeries>
            </lvc:CartesianChart.Series>

            <lvc:CartesianChart.DataTooltip>
                <local:MyTooltip/>
            </lvc:CartesianChart.DataTooltip>
        </lvc:CartesianChart>
    </Grid>
</Window>

请注意,MyTooltipContents已绑定到LineSeries

编辑:包含屏幕截图。enter image description here

相关问题