ASP.NET MVC 中的 Kendo 树图工具提示

Posted 2023-05-07

【中文标题】ASP.NET MVC 中的 Kendo 树图工具提示

【英文标题】：Kendo Treemap Tooltip in ASP.NET MVC

【发布时间】：2017-12-19 06:57:15

【问题描述】：

有人知道如何为剑道树状图创建悬停工具提示吗？ 像这样的东西，但对于 ASP.NET MVC：

Kendo Treemap Tooltip

我已经尝试过了，但是当我将鼠标移到字段上时，什么都没有出现..

 $("#treemap").kendoTooltip(
    filter: ".k-leaf,.k-treemap-title",
    position: "top",
    content: function (e) 
      var treemap = $("#treemap").data("kendoTreeMap");
      var item = treemap.dataItem(e.target.closest(".k-treemap-tile"));
      return item.name + ": " + item.value;
    
  );

当我使用 jquery 函数时，我可以在 javascript 控制台中写入每个 Treemap 字段的正确值。

 $("#treeMap").on("mouseenter", ".k-leaf", function () 
    var item = $("#treeMap").data("kendoTreeMap").dataItem($(this).closest(".k-treemap-tile"));
    var text = "Name: " + item.Name + "  Value: " + item.Value;
 console.log(text);

是否可以使用此功能并使用这些值创建剑道工具提示？

【问题讨论】：

treemap/item 在您的kendoTooltip 定义中包含什么？

我不知道..这只是演示中的代码

上面的演示对我有用..

在 ASP.NET MVC 中？

张贴您的 .cshtml 代码，用于 Treemap 控件。

【参考方案1】：

@Sandman：这是代码..

@(Html.Kendo().TreeMap()
      .Name("treeMap")
      .Theme("Material")
      .DataSource(dataSource => dataSource
          .Read(read => read
              .Action("GetMyTreeMapData", "Home")
          )
          .Model(m => m.Children("Items"))
      )
      .ValueField("Value")
      .TextField("Name")
      .Events(events => events
            .ItemCreated("onItemCreated")
            .DataBound("onDataBound")
      )

      .HtmlAttributes(new  style = "height:800px; font-size: 12px;" )