Question

我正在使用Silverlight 4工具包并使用Charting控件，特别是Line Series。我还使用了一个Microsoft Silverlight主题，它带有一些图表的默认样式。

我知道在ToolkitStyles.xaml中有一大堆彩色画笔可供图表工具包使用 - ChartBrush1，ChartBrush2等等。我不明白它们是如何被图表本身使用的。

我问这个的原因是因为我正在尝试更改LineSeries的DataPointStyle - 我已成功地在Blend中提取了数据点样式的副本并进行了我想要的更改，即大小数据点较小。但是一旦我这样做，图中的所有线系列都具有相同的颜色（橙色）并忽略ChartBrush资源（详见上文）。

什么推动了系列的颜色选择？怎么会发生？如果我拿一份模板，为什么我会丢失它？

谢谢！

Answer 1

工具箱Chart控件有一个属性Palette，它是样式的资源字典。

您可以在“Controls.DataVisualization.Toolkit \ Charting \ Chart \ Chart.xaml”中找到默认的图表样式。

在那里，您可以看到Palette是ResourceDictionaryCollection，并且集合中的每个ResourceDictionary都定义了DataPointStyle。每个DataPointStyle以不同的方式设置Background属性，这就是图表中每一行变为不同颜色的方式。

从这里可以清楚地看到为什么在xaml中明确设置了DataPointStyle的行系列中的行将始终具有相同的颜色 - 定义颜色的默认DataPointStyle已被替换。

解决方法是修改图表使用的调色板。在这里，我创建了一个基本样式，用于设置所需的DataPointStyle属性，然后对于字典集合中的每个DataPointStyle，指定BasedOn="{StaticResource DataPointStyleWithNoPoints}"。

<Style x:Key="DataPointStyleWithNoPoints" TargetType="Control">
    <Setter Property="Width" Value="1" />
    <Setter Property="Height" Value="1" />
</Style>

<datavis:ResourceDictionaryCollection x:Key="ChartPaletteWithNoDataPoints">
    <!-- Blue -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FFB9D6F7" />
            <GradientStop Color="#FF284B70" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Red -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FFFBB7B5" />
            <GradientStop Color="#FF702828" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Width" Value="1" />
            <Setter Property="Height" Value="1" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Light Green -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FFB8C0AC" />
            <GradientStop Color="#FF5F7143" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Yellow -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FFFDE79C" />
            <GradientStop Color="#FFF6BC0C" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Indigo -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FFA9A3BD" />
            <GradientStop Color="#FF382C6C" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Magenta -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FFB1A1B1" />
            <GradientStop Color="#FF50224F" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Dark Green -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FF9DC2B3" />
            <GradientStop Color="#FF1D7554" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Gray Shade -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FFB5B5B5" />
            <GradientStop Color="#FF4C4C4C" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Blue -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FF98C1DC" />
            <GradientStop Color="#FF0271AE" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Brown -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FFC1C0AE" />
            <GradientStop Color="#FF706E41" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Cyan -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FFADBDC0" />
            <GradientStop Color="#FF446A73" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Special Blue -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FF2F8CE2" />
            <GradientStop Color="#FF0C3E69" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Gray Shade 2 -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FFDCDCDC" />
            <GradientStop Color="#FF757575" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Gray Shade 3 -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FFF4F4F4" />
            <GradientStop Color="#FFB7B7B7" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
    <!-- Gray Shade 4 -->
    <ResourceDictionary>
        <RadialGradientBrush x:Key="Background" GradientOrigin="-0.1,-0.1" Center="0.075,0.015" RadiusX="1.05" RadiusY="0.9">
            <GradientStop Color="#FFF4F4F4" />
            <GradientStop Color="#FFA3A3A3" Offset="1" />
        </RadialGradientBrush>
        <Style x:Key="DataPointStyle" TargetType="Control" BasedOn="{StaticResource DataPointStyleWithNoPoints}">
            <Setter Property="Background" Value="{StaticResource Background}" />
        </Style>
        <Style x:Key="DataShapeStyle" TargetType="Shape">
            <Setter Property="Stroke" Value="{StaticResource Background}" />
            <Setter Property="StrokeThickness" Value="2" />
            <Setter Property="StrokeMiterLimit" Value="1" />
            <Setter Property="Fill" Value="{StaticResource Background}" />
        </Style>
    </ResourceDictionary>
</datavis:ResourceDictionaryCollection>

您只需在图表上指定调色板：

<toolkit:Chart Palette="{StaticResource ChartPaletteWithNoDataPoints}">
    ...
</toolkit:Chart>

Silverlight Toolkit图表系列的颜色选择

1 个答案: