CODEWITHSUNDEEP
wpfchartstoolkit
metalowy
metalowy

Reputation: 111

WPF Charting Vertical Chart

I have WPF Toolkit and I need to do vertical chart starting at the top. I was trying many things but always I end up with either error or chart that is going from left to right. I have no idea what to do, and I can't find any help :(

For example this is throwing an error:

<chart:Chart x:Name="LasChart" Width="764" HorizontalAlignment="Left" VerticalAlignment="Top" Height="896">
            <chart:LineSeries Name="LasData" IndependentValueBinding="{Binding Path=Key}" DependentValueBinding="{Binding Path=Value}">
                <chart:LineSeries.DependentRangeAxis>
                    <chart:LinearAxis Orientation="X" Location="Top"/>
                </chart:LineSeries.DependentRangeAxis>
            </chart:LineSeries>
        </chart:Chart>

Upvotes: 0

Views: 408

Answers (2)

metalowy
metalowy

Reputation: 111

I have figured that out :)

So if anyone want to do vertical chart with proper axes here it goes:

 <chart:Chart x:Name="LasChart" HorizontalAlignment="Left" VerticalAlignment="Top" UseLayoutRounding="False" Height="686">
            <chart:Chart.LayoutTransform>
                <RotateTransform  Angle="90" />
            </chart:Chart.LayoutTransform>

            <chart:Chart.Axes>
                <chart:CategoryAxis Orientation="X" 
                                  Location="Bottom" 
                                  Foreground="Black">
                    <chart:CategoryAxis.AxisLabelStyle>
                        <Style TargetType="chart:AxisLabel">
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate 
                                      TargetType="chart:AxisLabel">
                                        <TextBlock 
                             Text="{TemplateBinding FormattedContent}" 
                                               TextAlignment="Center" 
                                               RenderTransformOrigin="0.5,0.5">
                                            <TextBlock.RenderTransform>
                                                <RotateTransform Angle="-90" />
                                            </TextBlock.RenderTransform>
                                        </TextBlock>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </chart:CategoryAxis.AxisLabelStyle>
                </chart:CategoryAxis>

                <chart:LinearAxis Orientation="Y" 
                                  Location="Left" 
                                  Foreground="Black">
                    <chart:LinearAxis.AxisLabelStyle>
                        <Style TargetType="chart:AxisLabel">
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate 
                                      TargetType="chart:AxisLabel">
                                        <TextBlock 
                             Text="{TemplateBinding FormattedContent}" 
                                               TextAlignment="Center" 
                                               RenderTransformOrigin="0.5,0.5">
                                            <TextBlock.RenderTransform>
                                                <RotateTransform Angle="-90" />
                                            </TextBlock.RenderTransform>
                                        </TextBlock>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </chart:LinearAxis.AxisLabelStyle>
                </chart:LinearAxis>
            </chart:Chart.Axes>

            <chart:LineSeries Name="LasData" IndependentValueBinding="{Binding Path=Key}" DependentValueBinding="{Binding Path=Value}">
            </chart:LineSeries>

            <chart:Chart.LegendStyle>
                <Style TargetType="Control">
                    <Setter Property="Width" Value="0" />
                    <Setter Property="Height" Value="0" />
                </Style>
            </chart:Chart.LegendStyle>
        </chart:Chart>

Upvotes: 0

Ayyappan Subramanian
Ayyappan Subramanian

Reputation: 5366

You can just do a LayoutTransform. Refer below code.

 <wpfTool:Chart.LayoutTransform>
            <RotateTransform  Angle="90" />
        </wpfTool:Chart.LayoutTransform>

But not sure whether it will fit your requirement.

Upvotes: 1

Related Questions