在wpf toolkit图表lineseries中为图例项附近的矩形指定颜色

时间:2014-12-11 07:26:20

标签: c# wpf charts legend wpftoolkit

我正在动态地将lineseries添加到图表中。

foreach (KeyValuePair<string, List<KeyValuePair<DateTime, double>>> tempSeries in yieldSeries)
{
	LineSeries lineSeries = new LineSeries();
	lineSeries.DependentValuePath = "Value";
	lineSeries.IndependentValuePath = "Key";
	lineSeries.ItemsSource = tempSeries.Value;
	lineSeries.Title = tempSeries.Key;
	lineSeries.SetResourceReference(FrameworkElement.StyleProperty,"CommonLineSeries");
	lineSeries.Tag = Brushes.Red;
	
	lineSeries.Background = Brushes.Red;
	
	yieldTrendChart.Series.Add(lineSeries);
}

我希望按照特定的顺序为特定的顺序指定特定的颜色以实现这一点我已经为折线添加了如下样式

<Style x:Key="CommonLineSeries" TargetType="charting:LineSeries" BasedOn="{StaticResource {x:Type charting:LineSeries}}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="charting:LineSeries">
                <Canvas x:Name="PlotArea">
                    <Polyline Points="{TemplateBinding Points}" Stroke="{Binding Tag, RelativeSource={RelativeSource AncestorType={x:Type charting:LineSeries}}}" Style="{TemplateBinding PolylineStyle}"/>
                </Canvas>
            </ControlTemplate>
        </Setter.Value>
    </Setter>        
</Style>

问题 颜色已成功分配给图表中的线条但图例附近的矩形仍然会随机显示.net指定的颜色。 如何为矩形指定相同的颜色,就像我将其指定给直线一样?

1 个答案:

答案 0 :(得分:1)

您需要编辑LegendItem样式以更改图例矩形的颜色。

<强> XAML

Window x:Class="WpfApplication8.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"             
    xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"
    xmlns:visualizationToolkit="clr-namespace:System.Windows.Controls.DataVisualization;assembly=System.Windows.Controls.DataVisualization.Toolkit"
    xmlns:datavis ="clr-namespace:System.Windows.Controls.DataVisualization;assembly=System.Windows.Controls.DataVisualization.Toolkit"
    Title="Window1" Height="500" Width="700">
<Window.Resources>
    <Style x:Key="LineSeriesStyle1" TargetType="{x:Type chartingToolkit:LineSeries}">
        <Setter Property="IsTabStop" Value="False"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type chartingToolkit:LineSeries}">
                    <Canvas x:Name="PlotArea">
                        <Polyline Points="{TemplateBinding Points}" Stroke="{Binding Tag,RelativeSource={RelativeSource AncestorType={x:Type chartingToolkit:LineSeries}}}" />
                    </Canvas>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>
<Grid>
    <chartingToolkit:Chart x:Name="mcChart"  >
        <chartingToolkit:LineSeries Tag="Green" x:Name="chart" DependentValuePath="Value"  IsSelectionEnabled="True" IndependentValuePath="Key" ItemsSource="{Binding}" Style="{StaticResource LineSeriesStyle1}">
            <chartingToolkit:LineSeries.LegendItemStyle>
                <Style TargetType="chartingToolkit:LegendItem" >
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type chartingToolkit:LegendItem}">
                                <Border BorderBrush="Black" BorderThickness="0">
                                    <StackPanel>
                                        <StackPanel Orientation="Horizontal" >
                                            <Rectangle Width="12" Height="12" Fill="{Binding ElementName=chart,Path=Tag}" StrokeThickness="1"  />
                                            <datavis:Title Content="{TemplateBinding Content}" Foreground="{Binding ElementName=chart,Path=Tag}" FontSize="18" Margin="10"/>
                                        </StackPanel>
                                    </StackPanel>
                                </Border>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </chartingToolkit:LineSeries.LegendItemStyle>
        </chartingToolkit:LineSeries>
    </chartingToolkit:Chart>
</Grid>

<强> c#中

namespace WpfApplication8

{

public partial class Window1 : Window
{
    public Window1()
    {
        InitializeComponent();
        LoadColumnChartData();
    }

    private void LoadColumnChartData()
    {
        ((LineSeries)mcChart.Series[0]).ItemsSource =
        new KeyValuePair<string, int>[]{
        new KeyValuePair<string,int>("Project Manager", 13),
        new KeyValuePair<string,int>("CEO", 23),};

    }
}

}

<强>结果 enter image description here

<强>更新

 <Window.Resources>
    <Style x:Key="LineSeriesStyle1" TargetType="{x:Type chartingToolkit:LineSeries}">
        <Setter Property="Tag" Value="{Binding Tag,RelativeSource={RelativeSource AncestorType={x:Type chartingToolkit:LineSeries}}}"></Setter>
        <Setter Property="OverridesDefaultStyle" Value="True"></Setter>
        <Setter Property="IsTabStop" Value="False"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type chartingToolkit:LineSeries}">
                    <Canvas x:Name="PlotArea">
                        <Polyline x:Name="polyline"  Points="{TemplateBinding Points}" Stroke="{Binding Tag,RelativeSource={RelativeSource TemplatedParent}}" />
                    </Canvas>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>


</Window.Resources>
<Grid>
    <chartingToolkit:Chart Name="lineChart">
        <chartingToolkit:LineSeries Name="chart1" Tag="Blue" Background="Green"  Style="{StaticResource LineSeriesStyle1}" Title="KW Gastats"  DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding [0]}" IsSelectionEnabled="True">
            <chartingToolkit:LineSeries.LegendItemStyle>
                <Style TargetType="{x:Type chartingToolkit:LegendItem}" >
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type chartingToolkit:LegendItem}">
                                <Border >
                                    <StackPanel>
                                        <StackPanel Orientation="Horizontal" >
                                            <Rectangle Width="12" Height="12" Fill="{Binding ElementName=chart1,Path=Tag}"  Stroke="{Binding Background}" StrokeThickness="1"  />
                                            <datavis:Title Content="{TemplateBinding Content}" Foreground="{Binding ElementName=chart1,Path=Tag}" FontSize="18" Margin="10"/>
                                        </StackPanel>
                                    </StackPanel>
                                </Border>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </chartingToolkit:LineSeries.LegendItemStyle>
        </chartingToolkit:LineSeries>
        <chartingToolkit:LineSeries Name="chart2" Tag="Green"   Style="{StaticResource LineSeriesStyle1}" Title="Preu KW"   DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding [1]}" IsSelectionEnabled="True" >
            <chartingToolkit:LineSeries.LegendItemStyle>
                <Style TargetType="{x:Type chartingToolkit:LegendItem}" >
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type chartingToolkit:LegendItem}">
                                <Border >
                                    <StackPanel>
                                        <StackPanel Orientation="Horizontal" >
                                            <Rectangle Width="12" Height="12" Fill="{Binding ElementName=chart2,Path=Tag}"   StrokeThickness="1"  />
                                            <datavis:Title Content="{TemplateBinding Content}" Foreground="{Binding ElementName=chart2,Path=Tag}" FontSize="18" Margin="10"/>
                                        </StackPanel>
                                    </StackPanel>
                                </Border>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </chartingToolkit:LineSeries.LegendItemStyle>
        </chartingToolkit:LineSeries>
    </chartingToolkit:Chart>
</Grid>

c#代码

InitializeComponent();

        List<KeyValuePair<DateTime, int>> llistaGastats = new List<KeyValuePair<DateTime, int>>();
        llistaGastats.Add(new KeyValuePair<DateTime, int>(DateTime.Now, 100));
        llistaGastats.Add(new KeyValuePair<DateTime, int>(DateTime.Now.AddMonths(1), 200));
        List<KeyValuePair<DateTime, int>> llistaPreu = new List<KeyValuePair<DateTime, int>>();
        llistaPreu.Add(new KeyValuePair<DateTime, int>(DateTime.Now, 300));
        llistaPreu.Add(new KeyValuePair<DateTime, int>(DateTime.Now.AddMonths(1), 300));
        var dataSourceList = new List<List<KeyValuePair<DateTime, int>>>();
        dataSourceList.Add(llistaGastats);
        dataSourceList.Add(llistaPreu);
        lineChart.DataContext = dataSourceList;

<强>结果

enter image description here