Majid Shahabfar
Majid Shahabfar

Reputation: 4829

Setting Kendo Chart series name from datasource

in a kendo chart example I read series line value from datasource and set the series name statically (eg. "Series name"). now I'm looking for a way to set the series name dynamically accordant to data I read from DB. here is my code:

    @(Html.Kendo().Chart()
             .Name("Chart")
             .Title("Chart Title")
             .DataSource(ds=>ds.Read(read=>.read.Action("GetValues", "Controller")))
             .Series(series=>series.Line(model=>model.Value).Name("Series Name"))
     )

Upvotes: 0

Views: 5137

Answers (2)

Rodolpho Brock
Rodolpho Brock

Reputation: 8155

Answer from Telerik Admin at Telerik Forum:

@(Html.Kendo().Chart<ChartDynamicBinding.Models.ViewModel>()
        .Name("Chart3")
        .Title("Test")
        .DataSource(dataSource =>
                dataSource.Read(read => read.Action("Series", "Home"))
                .Group(g=> g.Add(v=> v.Series))
                .Sort(s=> s.Add(v=> v.Date))
        )
        .Legend(legend => legend
            .Position(ChartLegendPosition.Bottom)
        ).ChartArea(chartArea => chartArea
                    .Background("transparent")
        )
        .SeriesDefaults(seriesDefaults =>
            seriesDefaults.Line().Style(ChartLineStyle.Smooth)
        )
        .Series(series =>
        {
            series.Line(value => value.Hitcount, category => category.Date).Name("#:group.value#").Labels(labels => labels.Visible(true).Color("Red")).Color("Blue");                                                
        })
        .CategoryAxis(axis => axis
                .Labels(labels => labels.Rotation(-65)
            )
        )                       
        .ValueAxis(axis => axis
            .Numeric().Labels(labels => labels.Format("{0}"))
            .Line(line => line.Visible(false))
            .AxisCrossingValue(-10)
        )
        .Tooltip(tooltip => tooltip
            .Visible(true)
            .Format("{0}")
        )
)

Links:

Upvotes: 0

Majid Shahabfar
Majid Shahabfar

Reputation: 4829

using Scatterline chart together with GroupNameTemplate can be of help to set the chart series name dynamically. something like bellow code snippet:

<%= Html.Kendo().Chart(Model)
    .Name("chart")
    .Title("Stock Prices")
    .DataSource(dataSource => dataSource
        .Read(read => read.Action("_StockData", "Scatter_Charts"))
        .Group(group => group.Add(model => model.Symbol))
        .Sort(sort => sort.Add(model => model.Date).Ascending())
    )
    .Series(series =>
    {
        series.ScatterLine(model => model.Date, model => model.Close)
            .Name("close")
            .GroupNameTemplate("#= group.value # (#= series.name #)");
    })
    .Legend(legend => legend
        .Position(ChartLegendPosition.Bottom)
    )
    .YAxis(axis => axis.Numeric()
        .Labels(labels => labels
            .Format("${0}")
            .Skip(2)
            .Step(2)
        )
    )
    .XAxis(axis => axis.Date()
        .Labels(labels => labels.Format("MMM"))
    )
%>

Upvotes: 1

Related Questions