SeriesMapping in XAML

[Jeffrey]

How do I achieve the following SeriesMapping in XAML?

ItemMapping itemMapping;

            //ValueA Line
            SeriesMapping seriesMappingA = new SeriesMapping();
            seriesMappingA.SeriesDefinition = new LineSeriesDefinition() { ShowItemLabels = false };
            seriesMappingA.LegendLabel = "ValueA Performance";

            itemMapping = new ItemMapping();
            itemMapping.DataPointMember = DataPointMember.XValue;
            itemMapping.FieldName = "Date";
            seriesMappingA.ItemMappings.Add(itemMapping);

            itemMapping = new ItemMapping();
            itemMapping.DataPointMember = DataPointMember.YValue;
            itemMapping.FieldName = "ValueA";
            seriesMappingA.ItemMappings.Add(itemMapping);

            RadChart1.SeriesMappings.Add(seriesMappingA);

            //ValueB Line
            SeriesMapping seriesMappingB = new SeriesMapping();
            seriesMappingB.SeriesDefinition = new LineSeriesDefinition() { ShowItemLabels = false };
            seriesMappingB.LegendLabel = "ValueB Performance";

            itemMapping = new ItemMapping();
            itemMapping.DataPointMember = DataPointMember.XValue;
            itemMapping.FieldName = "Date";
            seriesMappingB.ItemMappings.Add(itemMapping);

            itemMapping = new ItemMapping();
            itemMapping.DataPointMember = DataPointMember.YValue;
            itemMapping.FieldName = "ValueB";
            seriesMappingB.ItemMappings.Add(itemMapping);

            RadChart1.SeriesMappings.Add(seriesMappingB);

            RadChart1.DefaultView.ChartArea.AxisX.LabelRotationAngle = 45;
            RadChart1.DefaultView.ChartArea.AxisX.DefaultLabelFormat = "dd/MM/yyyy";

[Jeffrey]

I've managed to come up with this, but the chart legend wont show. Is there something I'm missing?

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

            <telerikChart:RadChart.DefaultView>
                <telerikCharting:ChartDefaultView>
                    <telerikCharting:ChartDefaultView.ChartArea>
                        <telerikCharting:ChartArea>
                            <telerikCharting:ChartArea.AxisX>
                                <telerikCharting:AxisX LabelRotationAngle="45" DefaultLabelFormat="dd/MM/yyyy" />
                            </telerikCharting:ChartArea.AxisX>
                        </telerikCharting:ChartArea>
                    </telerikCharting:ChartDefaultView.ChartArea>
                </telerikCharting:ChartDefaultView>
            </telerikChart:RadChart.DefaultView>

            <telerikChart:RadChart.SeriesMappings>

                <telerikCharting:SeriesMapping LegendLabel="ValueA Performance">
                    <telerikCharting:SeriesMapping.SeriesDefinition>
                        <telerikCharting:LineSeriesDefinition ShowItemLabels="False" />
                    </telerikCharting:SeriesMapping.SeriesDefinition>
                    <telerikCharting:SeriesMapping.ItemMappings>
                        <telerikCharting:ItemMapping DataPointMember="XValue" FieldName="Date"></telerikCharting:ItemMapping>
                        <telerikCharting:ItemMapping DataPointMember="YValue" FieldName="ValueA"></telerikCharting:ItemMapping>
                    </telerikCharting:SeriesMapping.ItemMappings>
                </telerikCharting:SeriesMapping>

                <telerikCharting:SeriesMapping LegendLabel="ValueB Performance">
                    <telerikCharting:SeriesMapping.SeriesDefinition>
                        <telerikCharting:LineSeriesDefinition ShowItemLabels="False" />
                    </telerikCharting:SeriesMapping.SeriesDefinition>
                    <telerikCharting:SeriesMapping.ItemMappings>
                        <telerikCharting:ItemMapping DataPointMember="XValue" FieldName="Date"></telerikCharting:ItemMapping>
                        <telerikCharting:ItemMapping DataPointMember="YValue" FieldName="ValueB"></telerikCharting:ItemMapping>
                    </telerikCharting:SeriesMapping.ItemMappings>
                </telerikCharting:SeriesMapping>

            </telerikChart:RadChart.SeriesMappings>

        </telerikChart:RadChart>

[Ves]

Hi Jeffrey,

When declaring the ChartDefaultView in XAML you actually replace the default view, which RadChart creates automatically for your with your own instance. In this case you need to add its elements by yourself -- chart area, legend and title. Here is an example:

Copy Code

<telerikControls:RadChart x:Name="chart">
    <telerikControls:RadChart.DefaultView>
        <telerikCharting:ChartDefaultView>
            <telerikCharting:ChartDefaultView.ChartArea>
                <telerikCharting:ChartArea />
            </telerikCharting:ChartDefaultView.ChartArea>
            <telerikCharting:ChartDefaultView.ChartLegend>
                <telerikCharting:ChartLegend></telerikCharting:ChartLegend>
            </telerikCharting:ChartDefaultView.ChartLegend>
            <telerikCharting:ChartDefaultView.ChartTitle>
                <telerikCharting:ChartTitle>My Chart</telerikCharting:ChartTitle>
            </telerikCharting:ChartDefaultView.ChartTitle>
        </telerikCharting:ChartDefaultView>
    </telerikControls:RadChart.DefaultView>
</telerikControls:RadChart>

You can find more details about the ChartDefaultView in this help topic.

Sincerely,
Ves
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.

[Jeffrey]

Thanks for the reply. I've added the following chart legends in XAML. How can I map these 2 chart legends to their respective series. With the following xaml - my chart legends are displayed in White, whereas my line charts are in blue and green.

<telerikCharting:ChartDefaultView.ChartLegend>

                        <telerikCharting:ChartLegend>

                            <telerikCharting:ChartLegend.Items>

                                <telerikCharting:ChartLegendItem Label="SCOPE Performance" />

                                <telerikCharting:ChartLegendItem Label="CALLER Performance" />

                            </telerikCharting:ChartLegend.Items>

                        </telerikCharting:ChartLegend>

                    </telerikCharting:ChartDefaultView.ChartLegend>

[Ves]

Hi Jeffrey,

You can let RadChart create the corresponding legend items for you. Just point the ChartArea to the ChartLegend:

<telerikControls:RadChart x:Name="chart">
    <telerikControls:RadChart.DefaultView>
        <telerikCharting:ChartDefaultView>
            <telerikCharting:ChartDefaultView.ChartArea>
                <telerikCharting:ChartArea LegendName="MyLegend"/>
            </telerikCharting:ChartDefaultView.ChartArea>
            <telerikCharting:ChartDefaultView.ChartLegend>
                <telerikCharting:ChartLegend Name="MyLegend"></telerikCharting:ChartLegend>
            </telerikCharting:ChartDefaultView.ChartLegend>
            <telerikCharting:ChartDefaultView.ChartTitle>
                <telerikCharting:ChartTitle>My Chart</telerikCharting:ChartTitle>
            </telerikCharting:ChartDefaultView.ChartTitle>
        </telerikCharting:ChartDefaultView>
    </telerikControls:RadChart.DefaultView>
</telerikControls:RadChart>

I have attached a small example.

Kind regards,
Ves
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.

[Jeffrey]

Hi Ves,

It works perfectly. Thanks for the help.