[Solved] help with legend label template

[Thien]

Hi trying to get help with this. As you can see from the screenshot the legend shows the Group name and also the Series name. The Series is based on the Video Ports value. However, the datasource is being grouped by a different property called FriendlyName. How can I remove the part ":Video Ports"

@(Html.Kendo().Chart<MCUSamples24HoursModel>()
      .Name("RMXHourlyVideo")
      .Title("Video Utilization")
      .Legend(legend => legend.Position(ChartLegendPosition.Right))
      .Series(series => { series.Line(model => model.VideoPorts).Style(ChartLineStyle.Smooth).Markers(false); })
      .CategoryAxis(axis => axis.Categories(model => model.Hour))
      .ValueAxis(axis => axis
            .Numeric().Labels(labels => labels.Format("{0}"))
            .Line(line => line.Visible(false))
       )
      .DataSource(dataSource => dataSource
            .Group(group => group.Add(model => model.FriendlyName))
            .Sort(sort => sort.Add(model => model.HourTime))
            .Read(read => read.Url(Url.HttpRouteUrl("Default", new { controller = "McuSamples24Hour", action = "Post" })))
                .ServerOperation(true)
            )
      .ValueAxis(axis => axis.Numeric())
      .Tooltip(tooltip => tooltip
        .Visible(true)
        .Format("{0}")
      )
    )

[Iliana Dyankova]

Hi Thien,

For this requirement you can use series.name as a template: 

//....
.Series(series => { series.Line(model => model.VideoPorts).Name("#= group.value #").Style(ChartLineStyle.Smooth).Markers(false); })

Regards,
Iliana Nikolova
Telerik

 

 

[Thien]

Awesome, this works! Thank you!

[Thien]

Iliana, I am trying to get the time to display when hovering over the data points. Right now it just shows the number of video ports. I know its probably tied to tooltip templates but I have not been able to wrap my head around how templating works. I have attached a screenshot. Let me know if you can help.

[Thien]

The model.HourTime we are sorting by is a DateTime object.

[Thien]

We were able to get the time on the tooltip by changing it to this

.Tooltip(tooltip => tooltip.Visible(true).Template("#= kendo.toString(dataItem.Hour, '00') #:#= kendo.toString(dataItem.Minute, '00') # - #= dataItem.VideoPortPercentage #%"))