Line Chart Grouped by ID with Custom Legend

6 posts, 0 answers
  1. Giancarlo
    Giancarlo avatar
    15 posts
    Member since:
    Mar 2011

    Posted 13 Nov 2011 Link to this post

    Dear
    I'm trying to do something but I can not do it, I explain


    With this we plot a series group

    <telerikCharting:RadChart ItemsSource="{Binding Data}" Grid.Row="1"
                              x:Name="chart"
                              Margin="10,0,20,10"
                              PaletteBrushesRepeat="True">
        <telerikCharting:RadChart.SeriesMappings>
            <chart:SeriesMapping   >
                <chart:SeriesMapping.SeriesDefinition>
                    <chart:LineSeriesDefinition LegendDisplayMode="SeriesLabel"  LegendItemLabelFormat="#LEGENDLABEL"  >
                    </chart:LineSeriesDefinition>
                </chart:SeriesMapping.SeriesDefinition>
                <chart:SeriesMapping.GroupingSettings>
                    <chart:GroupingSettings ShouldCreateSeriesForLastGroup="True" >
                        <chart:GroupingSettings.GroupDescriptors>
                            <chart:ChartGroupDescriptor Member="IdTipoTramite"  />
                        </chart:GroupingSettings.GroupDescriptors>
                    </chart:GroupingSettings>
                </chart:SeriesMapping.GroupingSettings>
                <chart:SeriesMapping.ItemMappings>
                    <chart:ItemMapping DataPointMember="XValue" FieldName="NumeroPeriodo"   ></chart:ItemMapping>
                    <chart:ItemMapping DataPointMember="YValue" FieldName="CountTramites" ></chart:ItemMapping>
                    <chart:ItemMapping DataPointMember="LegendLabel"  FieldName="NombreTipoTramite"  ></chart:ItemMapping>
                    <chart:ItemMapping DataPointMember="LegendLabel"  FieldName="IdTipoTramite"  ></chart:ItemMapping>
                </chart:SeriesMapping.ItemMappings>
            </chart:SeriesMapping>
              
        </telerikCharting:RadChart.SeriesMappings>

    structure ItemsSource = "{Binding} Data" is the Next


    public class DataTramiteInicio
        {
            int IdTipoTramite { get; set; }
            int NumeroPeriodo { get; set; }
            long CountTramites { get; set; }
            string NombreTipoTramite { get; set; }
            string DescripcionPeriodo { get; set; }
            DateTime FinPeriodo { get; set; }
            DateTime InicioPeriodo { get; set; }
            string CodigoTipoTramite { get; set; }
        }

    What I want to do is customize the legend, but as I do?.

     To illustrate I group them by IdTipoTramite, which is good, because it is identified that a single value, I can not by another field

     Legend currently shown are the values ​​of IdTipoTramite but I want to show NombreTipoTramite

     Please how I can accomplish this, I suspect it is with LegendItemLabelFormat

     I attached some graphics for greater understanding

     thanks

  2. Nikolay
    Admin
    Nikolay avatar
    397 posts

    Posted 16 Nov 2011 Link to this post

    Hi Giancarlo,

    You would need to set the LegendDisplayMode to DataPointLabel and have a single ItemMapping with a DataPointMember="LegendLabel". Your series mapping should look similar to this :
    <telerikCharting:RadChart.SeriesMappings>
        <chart:SeriesMapping   >
            <chart:SeriesMapping.SeriesDefinition>
                <chart:LineSeriesDefinition LegendDisplayMode="DataPointLabel" >
                </chart:LineSeriesDefinition>
            </chart:SeriesMapping.SeriesDefinition>
            <chart:SeriesMapping.ItemMappings>
                <chart:ItemMapping DataPointMember="XValue" FieldName="NumeroPeriodo"   ></chart:ItemMapping>
                <chart:ItemMapping DataPointMember="YValue" FieldName="CountTramites" ></chart:ItemMapping>
                <chart:ItemMapping DataPointMember="LegendLabel" FieldName="NombreTipoTramite"  ></chart:ItemMapping>
            </chart:SeriesMapping.ItemMappings>
        </chart:SeriesMapping>
    </telerikCharting:RadChart.SeriesMappings>

    This way the legend will show the NombreTipoTramite.

    Hope this helps.

    Best wishes,
    Nikolay
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
  3. Giancarlo
    Giancarlo avatar
    15 posts
    Member since:
    Mar 2011

    Posted 16 Nov 2011 Link to this post

    Hello
    first of all I thank you for your response.
    The proposed solution does not work as expected (enclose the img1), there is duplicated in the legend Items


    <telerikCharting:RadChart ItemsSource="{Binding Data}" Grid.Row="1"
                                      x:Name="chart"
                                      Margin="10,0,20,10"
                                      PaletteBrushesRepeat="True">
                <telerikCharting:RadChart.SeriesMappings>
                    <chart:SeriesMapping   >
                        <chart:SeriesMapping.SeriesDefinition>
                            <chart:LineSeriesDefinition  LegendDisplayMode="DataPointLabel" >
                            </chart:LineSeriesDefinition>
                        </chart:SeriesMapping.SeriesDefinition>
                        <chart:SeriesMapping.ItemMappings>
                            <chart:ItemMapping DataPointMember="XValue" FieldName="NumeroPeriodo"   ></chart:ItemMapping>
                            <chart:ItemMapping DataPointMember="YValue" FieldName="CountTramites" ></chart:ItemMapping>
                            <chart:ItemMapping DataPointMember="LegendLabel" FieldName="NombreTipoTramite" ></chart:ItemMapping>
                              
                        </chart:SeriesMapping.ItemMappings>
                    </chart:SeriesMapping>
                      
                </telerikCharting:RadChart.SeriesMappings>
                  
                <telerikCharting:RadChart.DefaultView>
                    <chart:ChartDefaultView ChartLegendPosition="Top">
                        <chart:ChartDefaultView.ChartLegend>
                            <chart:ChartLegend x:Name="Legend" 
                                               Header=" " 
                                               Padding="75,25,0,0"
                                               Background="Transparent" 
                                               BorderThickness="0"
                                                >
                            </chart:ChartLegend>
                        </chart:ChartDefaultView.ChartLegend>
                        <chart:ChartDefaultView.ChartArea>
                            <chart:ChartArea LegendName="Legend"
                                             NoDataString="Cargando...">
                                <chart:ChartArea.AxisY>
                                    <chart:AxisY />
                                </chart:ChartArea.AxisY>
                                <chart:ChartArea.AxisX>
                                    <chart:AxisX StripLinesVisibility="Collapsed" MajorGridLinesVisibility="Visible"/>
                                </chart:ChartArea.AxisX>
      
                            </chart:ChartArea>
                        </chart:ChartDefaultView.ChartArea>
                    </chart:ChartDefaultView>
                </telerikCharting:RadChart.DefaultView>
            </telerikCharting:RadChart>

    The important thing is to group by IdTipoTramite field for a line graph grouped by value, however, I want the legend to display the field description IdTipoTramite that is contained in the field NombreTipoTramite

     For that reason I appends a grouping by IdTipoTramite, but can not get the legend of the field containing the value NombreTipoTramite


    I try this, but the values ​​are duplicated in the legend

    <telerikCharting:RadChart ItemsSource="{Binding Data}" Grid.Row="1"
                                      x:Name="chart"
                                      Margin="10,0,20,10"
                                      PaletteBrushesRepeat="True">
                <telerikCharting:RadChart.SeriesMappings>
                    <chart:SeriesMapping   >
                        <chart:SeriesMapping.SeriesDefinition>
                            <chart:LineSeriesDefinition LegendDisplayMode="DataPointLabel" >
                            </chart:LineSeriesDefinition>
                        </chart:SeriesMapping.SeriesDefinition>
      
                        <chart:SeriesMapping.GroupingSettings>
                            <chart:GroupingSettings >
                                <chart:GroupingSettings.GroupDescriptors>
                                    <chart:ChartGroupDescriptor Member="IdTipoTramite" />
                                </chart:GroupingSettings.GroupDescriptors>
                            </chart:GroupingSettings>
                        </chart:SeriesMapping.GroupingSettings>
      
                        <chart:SeriesMapping.ItemMappings>
                            <chart:ItemMapping DataPointMember="XValue" FieldName="NumeroPeriodo"   ></chart:ItemMapping>
                            <chart:ItemMapping DataPointMember="YValue" FieldName="CountTramites" ></chart:ItemMapping>
                            <chart:ItemMapping DataPointMember="LegendLabel"  FieldName="NombreTipoTramite" ></chart:ItemMapping>
                        </chart:SeriesMapping.ItemMappings>
                    </chart:SeriesMapping>
                      
                </telerikCharting:RadChart.SeriesMappings>
                  
                <telerikCharting:RadChart.DefaultView>
                    <chart:ChartDefaultView ChartLegendPosition="Top">
                        <chart:ChartDefaultView.ChartLegend>
                            <chart:ChartLegend x:Name="Legend" 
                                               Header=" " 
                                               Padding="75,25,0,0"
                                               Background="Transparent" 
                                               BorderThickness="0"
                                                >
                            </chart:ChartLegend>
                        </chart:ChartDefaultView.ChartLegend>
                        <chart:ChartDefaultView.ChartArea>
                            <chart:ChartArea LegendName="Legend"
                                             NoDataString="Cargando...">
                                <chart:ChartArea.AxisY>
                                    <chart:AxisY />
                                </chart:ChartArea.AxisY>
                                <chart:ChartArea.AxisX>
                                    <chart:AxisX StripLinesVisibility="Collapsed" MajorGridLinesVisibility="Visible"/>
                                </chart:ChartArea.AxisX>
      
                            </chart:ChartArea>
                        </chart:ChartDefaultView.ChartArea>
                    </chart:ChartDefaultView>
                </telerikCharting:RadChart.DefaultView>
            </telerikCharting:RadChart>

    Pls, Help me


  4. Nikolay
    Admin
    Nikolay avatar
    397 posts

    Posted 21 Nov 2011 Link to this post

    Hi Giancarlo,

    Please, find attached a sample application, which we have prepared to simulate a scenario similar to yours. You would not need to use the group settings in order to display the legend items, the mapping to LegendLabel would work as expected.

    In case you need to achieve a different view, please, send us a sample image of how the chart has to look like so that we can help further.

    Greetings,
    Nikolay
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
  5. Giancarlo
    Giancarlo avatar
    15 posts
    Member since:
    Mar 2011

    Posted 27 Nov 2011 Link to this post

    How hard is to understand me?

     look. I raise the issue, but with one common example,

     Put yourself in this scenario, sales of products

     The objective of the graph is: Create a Chart which shows the amount of products sold daily, the graph will be of type "line", where each line represents a product, the Y axis represents the amount and the X axis represents the period.  It must be remembered that the name of the products may be repeated, so for this we must take consideration of the Product ID to identify it as unique. This will display a legend with the names of the product

     I am in a similar situation,

     Thanks in advance

     

  6. Nikolay
    Admin
    Nikolay avatar
    397 posts

    Posted 30 Nov 2011 Link to this post

    Hi Giancarlo,

    Please, find an updated version of the sample project. In case you need to group the products by ID, we would recommend that you create ( or edit the existing ) a new property, which would combine the ID of the product and the legend label, then group by this property, instead of only by ID. This way you would achieve a legend label, which would display the combined properties.

    Greetings,
    Nikolay
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
Back to Top