在 kendo 图表上显示工具提示

Question

我正在为 ASP.NET Core

使用 Telerik UI

我有一个显示 date vs int 图表的 kendo 图表。该模型有 2 个属性 CreatedDateTime(datetime) 和 Count(int)。该图表按月计算总和。下面是模型和图表

public class Document
{
    public DateTime CreatedDateTime { get; set; }

    public int Count { get; set; }
}



@model IEnumerable<Document>

@(Html.Kendo().Chart(Model)
                .Name("chart")
                .Title("Dashboard Metrics")
                .Legend(legend => legend
                .Position(ChartLegendPosition.Bottom)
            )
            .Series(series =>
            {
                series
                .Area(model => model.Count, model => model.CreatedDateTime)
                .Aggregate(ChartSeriesAggregate.Sum)
                .Name("Document Count").Color("#BA2727").Opacity(.7);
            })
            .CategoryAxis(axis => axis
                .Date()
                .BaseUnit(ChartAxisBaseUnit.Months)
                .Labels(labels => labels.DateFormats(formats => formats.Months("MMM")))
            )
            .Tooltip(tooltip => tooltip
                .Visible(true)               
                .Format("{0:N0}"))
        )

目前图表仅显示“计数”作为工具提示，此外我还想在工具提示中显示月份。

我想知道工具提示显示月份的语法是什么？有 tooltip.template() 方法，但我无法理解同时显示计数和月份的语法。

Answer 1

这是一种在图表工具提示中获取系列名称的方法。

.Tooltip(tooltip => tooltip
    .Visible(true)                                    
    .Template("#= series.name #: #= value.current #%")
 )

Answer 2

您使用模板。 "category"就是你要的特殊关键字

"#= category # - #= value #"

您可能需要格式化日期，所以尝试这样的操作：

"#= kendo.toString( category , 'd/M/yyyy') # - #= value #"

在 kendo 图表上显示工具提示

Showing tooltip on kendo chart

kendo-ui

kendo-asp.net-mvc

kendo-chart