TreeMap概述

TreeMap以传统的树结构显示分层数据。TreeMaps还支持不同的渲染类型，如squfied、Vertical和Horizontal(切片和骰子算法)。

Telerik UI TreeMap HtmlHelper for ASP。NET MVCis a server-side wrapper for the Kendo UI TreeMap widget.

新的Telerik UI为ASP。净MVC吗?

Telerik UI for ASP。NET MVC是一个具有 110+ 组件的专业级UI库，用于构建现代和功能丰富的 应用程序。想要试用它，请注册一个30天的免费试用。

下载免费试用

要查看组件的运行情况，请查看示例:

• TreeMap HtmlHelper的演示页面
• TreeMap TagHelper的演示页面

初始化TreeMap

下面的例子演示了如何使用TreeMap TagHelper和TreeMap HtmlHelper来定义TreeMap。

@(Html.Kendo().TreeMap() .Name("treeMap") .DataSource(dataSource => dataSource .Read(read => read .Action("Population_Read"， "treeMap")) .Model(m => m.m erchildren ("Items")) .ValueField("Value") .TextField("Name")))

public ActionResult Population_Read() {var result = new List();var population = new population ("Parent One"， 1, new List< population >());population.Items。Add(new Population("Child 1"， 2, null));population.Items。Add(new Population("Child 2"， 3, null));result.Add(人口);返回Json(结果);｝

public class Population {public Population(字符串名称，int值，列表项){this。Name = Name;这一点。Value = Value;这一点。Items =物品;}公共字符串名称{get;设置;}公共int值{get;设置;} public List Items {get; set; } }

绑定远程数据

也可以绑定数据源远程数据。下面的例子演示了如何将Kendo UI TreeMap TagHelper绑定到远程服务。

@(Html.Kendo().TreeMap() .Name("treeMap") .DataSource(dataSource => dataSource .Read(read => read .Action("_PopulationUSA"， "treeMap")) .Model(m => m.m erchildren ("Items"))) .ValueField("Value") .TextField("Name") .HtmlAttributes(new {style = "height:600px;字体大小:12 px;“}))

事件

你可以订阅所有TreeMap事件．

按处理程序名称处理事件

下面的示例演示如何通过处理程序名称订阅事件。

@(Html.Kendo().TreeMap() .Name("treemap") .Events(events => events .ItemCreated("onItemCreated") .DataBound("onDataBound")))