This is a migrated thread and some comments may be shown as answers.

Error Binding String Value to X Axis using MVVM.

3 Answers 122 Views
Chart
This is a migrated thread and some comments may be shown as answers.
Saurabh
Top achievements
Rank 1
Saurabh asked on 15 Jul 2011, 07:12 PM
Hi,

I am using MVVM Architecture, When I tried to bind ClientID (int value) to X Axis, everything seems working fine, but when I tried to bind Client Name (String Value) to X Axis. I am getting Error saying "Input string is not in correct format".

How Can I bind Custom String Value to X Axis using XAML (no Code Behind)?


 

<telerik:RadChart x:Name="RadChart1" ItemsSource="{Binding Data}" Grid.Row="0" Grid.Column="0" Width="700" >

<telerik:RadChart.SeriesMappings>
<
telerik:SeriesMappingCollection>
<
telerik:SeriesMapping LegendLabel="CandleStick Series" >

 <telerik:SeriesMapping.SeriesDefinition >

<telerik:CandleStickSeriesDefinition /> 
</
telerik:SeriesMapping.SeriesDefinition>

<telerik:ItemMapping FieldName="High" DataPointMember="High" />

<telerik:ItemMapping FieldName="Low" DataPointMember="Low" />

<telerik:ItemMapping FieldName="Open" DataPointMember="Open" />

<telerik:ItemMapping FieldName="Close" DataPointMember="Close" />

<telerik:ItemMapping FieldName="CName" DataPointMember="XValue" />
</telerik:SeriesMapping>

</telerik:SeriesMappingCollection>

 </telerik:RadChart.SeriesMappings>

<telerik:RadChart.DefaultView>

<telerik:ChartDefaultView>

<telerik:ChartDefaultView.ChartArea>

<telerik:ChartArea>

<telerik:ChartArea.AxisX>

<telerik:AxisX LabelRotationAngle="90" Title="Client Name"> </telerik:AxisX>

</telerik:ChartArea.AxisX>

<telerik:ChartArea.AxisY> <telerik:AxisY ExtendDirection="Down" AutoRange="False" MinorTickPointMultiplier="5" Step="{Binding Interval}" MinValue="{Binding MinValue}" MaxValue="{Binding MaxValue}" Title="Blood Volume (mL)">

 </telerik:AxisY>

 </telerik:ChartArea.AxisY>

 <telerik:ChartArea.Legend>

 <telerik:ChartLegend Visibility="Collapsed" /> </telerik:ChartArea.Legend>

</telerik:ChartArea> </telerik:ChartDefaultView.ChartArea> </telerik:ChartDefaultView> </telerik:RadChart.DefaultView> 

</telerik:RadChart>

 

3 Answers, 1 is accepted

Sort by
0
Evgenia
Telerik team
answered on 20 Jul 2011, 08:04 AM
Hi Saurabh,

The XValue and YValue DataPointMember-s require their corresponding FieldName to be of type double. That's the reason why you can't set string as XValue. Instead you should use XCategory. For more information - refer to this help topic. 

Best wishes,
Evgenia
the Telerik team

Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

0
Saurabh
Top achievements
Rank 1
answered on 20 Jul 2011, 06:23 PM
Hi

<
telerik:RadChart x:Name="RadChart1" ItemsSource="{Binding Data}" Grid.Row="0"  Grid.Column="0" Width="700" >
               <telerik:RadChart.SeriesMappings>
                   <telerik:SeriesMappingCollection>
                       <telerik:SeriesMapping LegendLabel="CandleStick Series"  >
                           <telerik:SeriesMapping.SeriesDefinition  >
                               <telerik:CandleStickSeriesDefinition />
                           </telerik:SeriesMapping.SeriesDefinition>
                           <telerik:ItemMapping FieldName="High" DataPointMember="High" />
                           <telerik:ItemMapping FieldName="Low" DataPointMember="Low" />
                           <telerik:ItemMapping FieldName="Open" DataPointMember="Open" />
                           <telerik:ItemMapping FieldName="Close" DataPointMember="Close" />
                           <telerik:ItemMapping FieldName="X" DataPointMember="XValue" />
                           <telerik:ItemMapping FieldName="XCategory" DataPointMember="XCategory" />
                       </telerik:SeriesMapping>
                       <telerik:SeriesMapping >
                           <telerik:SeriesMapping.SeriesDefinition>
                               <telerik:ScatterSeriesDefinition PointShape="Square" PointSize="5" >
                                     
                               </telerik:ScatterSeriesDefinition>
                           </telerik:SeriesMapping.SeriesDefinition>
                           <telerik:ItemMapping FieldName="Y"  DataPointMember="YValue"/>
                           <telerik:ItemMapping FieldName="X" DataPointMember="XValue" />
                           <telerik:ItemMapping FieldName="XCategory" DataPointMember="XCategory" />
                       </telerik:SeriesMapping>
                   </telerik:SeriesMappingCollection>                    
               </telerik:RadChart.SeriesMappings>                
               <telerik:RadChart.DefaultView>
                   <telerik:ChartDefaultView>
                       <telerik:ChartDefaultView.ChartArea>
                           <telerik:ChartArea>
                               <telerik:ChartArea.AxisX >
                                   <telerik:AxisX TicksDistance="2" MinorTicksVisibility="Collapsed"  LabelRotationAngle="90" Title="Client ID">                                                                               
                                   </telerik:AxisX>                                    
                                     
                               </telerik:ChartArea.AxisX>
                                 
                               <telerik:ChartArea.AxisY>
                                   <telerik:AxisY ExtendDirection="Down" AutoRange="False" MinorTickPointMultiplier="5" Step="{Binding Interval}"  MinValue="{Binding MinValue}" MaxValue="{Binding MaxValue}"  Title="Quantity">                                        
                                   </telerik:AxisY>
                               </telerik:ChartArea.AxisY>
                               <telerik:ChartArea.Legend>
                                   <telerik:ChartLegend Visibility="Collapsed" />
                               </telerik:ChartArea.Legend>
                           </telerik:ChartArea>
                       </telerik:ChartDefaultView.ChartArea>                        
                   </telerik:ChartDefaultView>
               </telerik:RadChart.DefaultView>                
           </telerik:RadChart>
Thanks for your response, Issue has been resolved after applying your suggestion.

But ticks on X-Axis are displaying between two Client names, I want to display ticks, candlestick and client name on same line.


See Image for more details.

0
Evgenia
Telerik team
answered on 21 Jul 2011, 08:35 AM
Hi Saurabh,

RadChart allows you to modify the layout of the XAxis for better readability. By using the LayoutMode property of the XAxis you may control the way the Labels and Series are positioned according to the MajorTicks. This is described in our help topic. What you need is having the layoutMode property set to Inside:
RadChart1.DefaultView.ChartArea.AxisX.LayoutMode = AxisLayoutMode.Inside; 

Let me know how this works for you.

Greetings,
Evgenia
the Telerik team

Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

Tags
Chart
Asked by
Saurabh
Top achievements
Rank 1
Answers by
Evgenia
Telerik team
Saurabh
Top achievements
Rank 1
Share this question
or