工具包图表旋转标签X轴

时间:2014-09-26 08:52:38

标签: c# .net silverlight charts silverlight-toolkit

首先感谢您阅读本文。

我有以下问题:
我希望我的X轴标签可以旋转90度。这样文本就面向垂直而不是水平。我的X轴是自动生成的,但不一定是。 这样标签的内容就是垂直而不是水平。我已经尝试了多种方法来实现这一目标,但它们都没有为我工作。所以我真的希望有人知道如何让这个工作。通过我尝试的选项,只有另一个轴只显示数字。虽然我想要的是要转动的标签,以便所有文本都适合轴而不会相互重叠。

下面的图片就是现在的样子: How it is right now.

以下是我希望它的一个例子(这是在excel中制作的): The way i would like it to be.

我在更多的地方环顾四周,但我找不到一个适合我的地方 xaml或后面的代码都适合我 这是我现在使用的代码:

<toolkit:Chart Margin="8,72,0,8" Title="Aantal meldingen per afdeling" x:Name="chartMeldingenPerAfdeling">
        <toolkit:Chart.Background>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="White" Offset="0"/>
                <GradientStop Color="#FF476D88" Offset="1"/>
            </LinearGradientBrush>
        </toolkit:Chart.Background>
        <toolkit:ColumnSeries ItemsSource="{Binding}" DependentValuePath="AantalMeldingen"
                               IndependentValuePath="Afdeling" Margin="0,0,0,1" 
                           Title="Aantal meldingen" Padding="0" VerticalContentAlignment="Center" 
                           HorizontalContentAlignment="Center" FontSize="8"/>
        <toolkit:LineSeries ItemsSource="{Binding}" DependentValueBinding="{Binding Percentage}" DependentRangeAxis="{Binding ElementName=PercentageAxis}"
                            IndependentValueBinding="{Binding Afdeling}" IndependentAxis="{Binding ElementName=lin}" Title="Pareto"/>
        <toolkit:Chart.Axes>
            <toolkit:LinearAxis Orientation="Y" Location="Left" Title="Aantal" x:Name="AantalAxis"/>
            <toolkit:LinearAxis Orientation="Y" Location="Right" Title="Percentage" x:Name="PercentageAxis" Minimum="0" Maximum="100"/>
        </toolkit:Chart.Axes>
    </toolkit:Chart>

提前谢谢。

2 个答案:

答案 0 :(得分:5)

请检查此代码:

<toolkit:Chart Title="{Binding ChartTitle}" x:Name="myChart" Style="{StaticResource myChartStyle}" BorderBrush="{x:Null}"  Background="Black" Foreground="White">
            <toolkit:ColumnSeries ItemsSource="{Binding LegendList}"
                DependentValueBinding="{Binding FeatureQuantity}" 
                IndependentValueBinding="{Binding LegendName}" DataPointStyle="{Binding Source={StaticResource ColorByGradeColumn}}" >

            </toolkit:ColumnSeries>

            <toolkit:Chart.Axes>
                <toolkit:CategoryAxis Orientation="X" 
                                      Location="Bottom" 
                                      Foreground="White">
                    <toolkit:CategoryAxis.AxisLabelStyle>
                        <Style TargetType="toolkit:AxisLabel">
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate 
                                          TargetType="toolkit:AxisLabel">
                                        <TextBlock 
                                 Text="{TemplateBinding FormattedContent}" 
                                                   TextAlignment="Right" 
                                                   TextWrapping="Wrap" 
                                                   Width="60" 
                                                   Margin="-20,15,0,0" 
                                                   RenderTransformOrigin="0.5,0.5">
                                            <TextBlock.RenderTransform>
                                                <RotateTransform Angle="90" />
                                            </TextBlock.RenderTransform>
                                        </TextBlock>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </toolkit:CategoryAxis.AxisLabelStyle>
                </toolkit:CategoryAxis>
            </toolkit:Chart.Axes>

        </toolkit:Chart>

结果是: http://upload7.ir/imgs/2014-10/42094080161295718077.png

答案 1 :(得分:1)

您可以针对toolkit:ColumnSeries XAML元素尝试此操作:

        <chartingToolkit:ColumnSeries ItemsSource="{Binding}" DependentValuePath="AantalMeldingen" IndependentValuePath="Afdeling" Margin="0,0,0,1"  Title="Aantal meldingen" Padding="0" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" FontSize="8">
            <chartingToolkit:ColumnSeries.IndependentAxis>
                <chartingToolkit:CategoryAxis Orientation="X">
                    <chartingToolkit:CategoryAxis.AxisLabelStyle>
                        <Style TargetType="chartingToolkit:AxisLabel">
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="chartingToolkit:AxisLabel">
                                        <TextBlock Text="{TemplateBinding FormattedContent}">
                                                <TextBlock.LayoutTransform>
                                                    <RotateTransform Angle="-90"/>
                                                </TextBlock.LayoutTransform>
                                        </TextBlock>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </chartingToolkit:CategoryAxis.AxisLabelStyle>
                </chartingToolkit:CategoryAxis>
            </chartingToolkit:ColumnSeries.IndependentAxis>
        </chartingToolkit:ColumnSeries>