Binding chart control declaratively

[Arun Mudiraj]

Hi,

 I am trying to modify the MVVM example for chart control, to bind the data in markup using ItemsSource="{Binding Source={StaticResource MyList}}" . It says No Data Series.

However if I bind it in code behind with ItemSource= PageViewModel it works fine.
I tried checking if my markup binding is correct by assigning it to dataContext and check in debugger, it looks fine.
Is it possible to bind to ItemSource using Markup without code behind, any sample code would be helpful.

Thanks,
Arun

<telerikChart:RadChart x:Name="RadChart1" ItemsSource="{Binding Source={StaticResource MyList}}" >-->

 

<telerikChart:RadChart x:Name="RadChart1" > 

 

<telerikChart:RadChart.DefaultView>

 

<telerikCharting:ChartDefaultView >

 

 

<telerikCharting:ChartDefaultView.ChartArea> <telerikCharting:ChartArea > <telerikCharting:ChartArea.AxisY> <telerikCharting:AxisY AutoRange="False" MinValue = "0"

 

MaxValue="100" Step="10" />  

 

</telerikCharting:ChartArea.AxisY> <telerikCharting:ChartArea.DataSeries> <telerikCharting:DataSeries Label="Bar Series 1" >

 

 

<telerikCharting:DataSeries.Definition> <telerikCharting:BarSeriesDefinition /> </telerikCharting:DataSeries.Definition> </telerikCharting:DataSeries>

 

 

 

</telerikCharting:ChartArea.DataSeries> </telerikCharting:ChartArea> </telerikCharting:ChartDefaultView.ChartArea>

 

 

 

</telerikCharting:ChartDefaultView>

 

 

 

</telerikChart:RadChart.DefaultView> <telerikChart:RadChart.SeriesMappings>

 

 

 

<telerikCharting:SeriesMapping> <telerikCharting:SeriesMapping.ItemMappings>

 

 

 

<telerikCharting:ItemMapping DataPointMember="YValue" FieldName="Person.Grade">  

 

 

</telerikCharting:ItemMapping> <telerikCharting:ItemMapping DataPointMember="XCategory" FieldName="Person.Name">

 

 

 </telerikCharting:ItemMapping> </telerikCharting:SeriesMapping.ItemMappings>

 

 

 

</telerikCharting:SeriesMapping>

 

 

 

</telerikChart:RadChart.SeriesMappings> </telerikChart:RadChart>

 

 

 

 

 

[Dwight]

Hi Arun,

It is not possible to simultaneously set ItemSource and fill the DataSeries in the DefaultView.

Currently, you can only set the default series definition of the RadChart:

RadChart.DefaultSeriesDefinition = new BarSeriesDefinition();

or

<telerikChart:RadChart.DefaultSeriesDefinition>
   <telerikCharting:BarSeriesDefinition />
</telerikChart:RadChart.DefaultSeriesDefinition>

Let me know if you need further assistance.

Best,
Evtim
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Arun Mudiraj]

Thanks for the response, I do not want to fill the dataseries, but assign itemSource in XAML form resource or datacontext,but am unable to do so, can we do that in xaml for pure MVVM pattern, which do not have code in code behind for xaml files.

Thanks,
Arun

[Dwight]

Hi Arun,

Here is how the XAML should look:

<telerikChart:RadChart x:Name="RadChart1" >
  <!-- Set Default Series Definition: -->
  <telerikChart:RadChart.DefaultSeriesDefinition>
     <telerikCharting:BarSeriesDefinition />
  </telerikChart:RadChart.DefaultSeriesDefinition>
  <!-- Set Default Series Definition -->
  <telerikChart:RadChart.DefaultView>
    <telerikCharting:ChartDefaultView >
      <telerikCharting:ChartDefaultView.ChartArea>
        <telerikCharting:ChartArea >
          <telerikCharting:ChartArea.AxisY>
            <telerikCharting:AxisY AutoRange="False" MinValue = "0" MaxValue="100" Step="10" />
          </telerikCharting:ChartArea.AxisY>
<!--          <telerikCharting:ChartArea.DataSeries>                  -->
<!--            <telerikCharting:DataSeries Label="Bar Series 1" >    -->
<!--              <telerikCharting:DataSeries.Definition>             -->
<!--                <telerikCharting:BarSeriesDefinition />           -->
<!--              </telerikCharting:DataSeries.Definition>            -->
<!--            </telerikCharting:DataSeries>                         -->
<!--          </telerikCharting:ChartArea.DataSeries>                 -->
        </telerikCharting:ChartArea>
      </telerikCharting:ChartDefaultView.ChartArea>
    </telerikCharting:ChartDefaultView>
  </telerikChart:RadChart.DefaultView>
  <telerikChart:RadChart.SeriesMappings>
    <telerikCharting:SeriesMapping>
      <telerikCharting:SeriesMapping.ItemMappings>
        <telerikCharting:ItemMapping DataPointMember="YValue" FieldName="Person.Grade" />
        <telerikCharting:ItemMapping DataPointMember="XCategory" FieldName="Person.Name" />
      </telerikCharting:SeriesMapping.ItemMappings>
    </telerikCharting:SeriesMapping>
  </telerikChart:RadChart.SeriesMappings>
</telerikChart:RadChart>

Note, that creating of DataSeries is removed since data binding is used. You cannot use those simultaneously. Either use DataSeries or Data Binding.

Regards,
Evtim
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Vinod Sardar]

This works for Bar Chart.

When I change Default series definition to Piechart....  as follows: Legend Information is not shown.

 

 

<!-- Set Default Series Definition: -->

 

 

 

 

<telerikChart:RadChart.DefaultSeriesDefinition>

 

 

 

 

<telerikCharting:PieSeriesDefinition />

 

 

 

 

</telerikChart:RadChart.DefaultSeriesDefinition>


I am using following code:

 

 

<telerikChart:RadChart x:Name="RadChart1" >

 

 

 

 

<!-- Set Default Series Definition: -->

 

 

 

 

<telerikChart:RadChart.DefaultSeriesDefinition>

 

 

 

 

<telerikCharting:PieSeriesDefinition />

 

 

 

 

</telerikChart:RadChart.DefaultSeriesDefinition>

 

 

 

 

 

<!-- Set Default Series Definition -->

 

 

 

 

<telerikChart:RadChart.DefaultView>

 

 

 

 

<telerikCharting:ChartDefaultView >

 

 

 

 

<telerikCharting:ChartDefaultView.ChartArea>

 

 

 

 

<telerikCharting:ChartArea >

 

 

 

 

 

 

 

 

</telerikCharting:ChartArea>

 

 

 

 

</telerikCharting:ChartDefaultView.ChartArea>

 

 

 

 

</telerikCharting:ChartDefaultView>

 

 

 

 

</telerikChart:RadChart.DefaultView>

 

 

 

 

 

<telerikChart:RadChart.SeriesMappings>

 

 

 

 

<telerikCharting:SeriesMapping>

 

 

 

 

<telerikCharting:SeriesMapping.ItemMappings>

 

 

 

 

<telerikCharting:ItemMapping DataPointMember="YValue" FieldName="Grade" />

 

 

 

 

<telerikCharting:ItemMapping DataPointMember="LegendLabel" FieldName="Name" />

 

 

 

 

<telerikCharting:ItemMapping DataPointMember="XCategory" FieldName="Name" />

 

 

 

 

</telerikCharting:SeriesMapping.ItemMappings>

 

 

 

 

</telerikCharting:SeriesMapping>

 

 

 

 

</telerikChart:RadChart.SeriesMappings>

 

 

 

 

 

</telerikChart:RadChart>

Please let mw know what I am missing... or what extra things I need to do?

Thanks,
Vinod Sa.

 

[Vinod Sardar]

Thanks... I have resolved it.. by adding ChartLegend in XAML.