Question

在剑道图表示例中，我从数据源读取系列行值并静态设置系列名称（例如，＆＃34;系列名称＆＃34;）。现在我正在寻找一种方法来设置系列名称，动态地符合我从DB读取的数据。这是我的代码：

    @(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"))
     )

Answer 1

使用Scatterline图表和GroupNameTemplate可以帮助动态设置图表系列名称。比如波纹管代码片段：

<%= 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"))
    )
%>

Answer 2

Telerik论坛的Telerik管理员回答：

@(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}")
        )
)

链接：

从数据源设置Kendo Chart系列名称

2 个答案: