This project is read-only.

Change Legend position in Chart

Apr 30, 2014 at 8:12 AM
Hi,

I have used Win RT Xaml Toolkit Bar Chart in my Windows 8 App. Please see the below image..

Image

Expected : shows the actual bar chart I want

Obtained : shows the bar chart that is generated

I want to have these changes:
  1. Position of Legends below chart
  2. The X-axis to be in reverse order
  3. Remove the 2 small lines along the Y-axis
Please help me in order to achieve above.

Thanks in advance.
Apr 30, 2014 at 8:32 AM
Sorry, I haven't written the chart controls and am a bit too busy with other projects to try to figure it out. Maybe you can debug the code version of the library to see what to do?
Sep 22, 2014 at 10:53 PM
Edited Sep 22, 2014 at 11:31 PM
  1. Position of Legends below chart
See \WinRTXamlToolkit.Controls.DataVisualization\Themes\Generic.xaml (Line: 1219) in source code.

For example:
                            <Grid
                                Grid.Row="1"
                                Margin="0,15,0,15">
                                <Grid.RowDefinitions>
                                    <RowDefinition
                                        Height="*" />
                                    <RowDefinition
                                        Height="Auto" />
                                </Grid.RowDefinitions>

                                <dataVis:Legend
                                    x:Name="Legend"
                                    Style="{TemplateBinding LegendStyle}"
                                    Grid.Row="1" />
                                <chartingprimitives:EdgePanel
                                    x:Name="ChartArea"
                                    Style="{TemplateBinding ChartAreaStyle}">
                                    <Grid
                                        Canvas.ZIndex="-1"
                                        Style="{TemplateBinding PlotAreaStyle}" />
                                    <Border
                                        Canvas.ZIndex="10"
                                        BorderBrush="#FFFFFF"
                                        BorderThickness="0" />
                                </chartingprimitives:EdgePanel>
                            </Grid>
and in your MainView.xaml:
            <charting:Chart>
                <charting:Chart.LegendStyle>
                    <Style TargetType="ItemsControl">
                        <Setter Property="HorizontalAlignment" Value="Center"/>
                        <Setter Property="ItemsPanel">
                            <Setter.Value>
                                <ItemsPanelTemplate>
                                    <WrapGrid Orientation="Horizontal" />
                                </ItemsPanelTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </charting:Chart.LegendStyle>
                <charting:PieSeries x:Name="pieChart" ItemsSource="{Binding Parts}" IndependentValuePath="Name" DependentValuePath="Value" IsSelectionEnabled="True" 
                                SelectedItem="{Binding SelectedPart, Mode=TwoWay}" DataPointColorPath="Color">
                    <charting:PieSeries.LegendItemStyle>
                        <Style TargetType="charting:LegendItem">
                            <Setter Property="Margin" Value="5,3"/>
                        </Style>
                    </charting:PieSeries.LegendItemStyle>
                </charting:PieSeries>
            </charting:Chart>
Have a good projects.
Jan 20, 2015 at 10:44 AM
Edited Jan 22, 2015 at 1:34 PM
thnx it is useful.