New to Telerik UI for ASP.NET MVC? Download free 30-day trial

TreeMapBuilder

Methods

AutoBind(System.Boolean)

If set to "false", the TreeMap will not bind to the DataSource during initialization. In this case, the data binding will occur when the Change event of the DataSource fires. By default the TreeMap will bind to its DataSource specified in the configuration.

Parameters

value - System.Boolean

The value that configures the AutoBind option.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .AutoBind(false)
                .DataSource(...)
             )

Theme(System.String)

Sets the type of the Kendo UI theme of the TreeMap. Note: Starting with version Q2 2024, the default value for the Theme option is "sass" instead of "default". It is recommended to use "sass" with version Q2 2024 or later.

Parameters

value - System.String

The value that configures the theme.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .Theme("sass")
             )

ValueField(System.String)

Defines the data item field that contains the tile value.

Parameters

value - System.String

The name of the Model property that holds the tile value.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .ValueField("TileValue")
                .DataSource(dataSource => dataSource
                    .Read(read => read.Action("ActionName", "ControllerName"))
                    .Model(m => m.Children("Items"))
                )
             )

ColorField(System.String)

Defines the data item field that contains the tile color.

Parameters

value - System.String

The name of the Model property that holds the tile color.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .ColorField("color")
                .DataSource(dataSource => dataSource
                    .Read(read => read.Action("ActionName", "ControllerName"))
                    .Model(m => m.Children("Items"))
                )
             )

TextField(System.String)

Defines the data item field that contains the tile title.

Parameters

value - System.String

The name of the Model property that holds the title of the tile.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .TextField("TitleTile")
                .DataSource(dataSource => dataSource
                    .Read(read => read.Action("ActionName", "ControllerName"))
                    .Model(m => m.Children("Items"))
                )
             )

Template(System.String)

Specifies the template that renders the content of the tile. The available fields in the template are: - dataItem: The original data item used to construct the point. - text: The original tile text.

Parameters

value - System.String

The value that configures the content of the template.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .Template("<h2>#=text#: #=dataItem.value#</h2>")
             )

TemplateId(System.String)

Specifies the template that renders the content of the tile. The available fields in the template are: - dataItem: The original data item used to construct the point. - text: The original tile text.

Parameters

value - System.String

The "id" of the external Kendo UI template.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .TemplateId("tileTemplate")
             )
            <script id="tileTemplate" type="text/x-kendo-template">
                <h2>#=text#: #=dataItem.value#</h2>
            </script>

TemplateView(System.Web.Mvc.MvcHtmlString)

Specifies the template that renders the content of the tile. The available fields in the template are: - dataItem: The original data item used to construct the point. - text: The original tile text.

Parameters

value - System.Web.Mvc.MvcHtmlString

The Razor View that will render the template content.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .TemplateView(Html.Partial("TileTemplateView"))
             )

TemplateHandler(System.String)

Specifies the template that renders the content of the tile. The available fields in the template are: - dataItem: The original data item used to construct the point. - text: The original tile text.

Parameters

value - System.String

The JavaScript function that will return the template content.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .TemplateHandler("getTileTemplate")
             )
            <script>
                function getTileTemplate(data) {
                    return `<h2>${data.text}: ${data.dataItem.value}</h2>`;
                }
            </script>

Template(Kendo.Mvc.UI.TemplateBuilder)

Specifies the template that renders the content of the tile. The available fields in the template are: - dataItem: The original data item used to construct the point. - text: The original tile text.

Parameters

template - TemplateBuilder<TModel>

A Template component that configures the template content.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .Template(Html.Kendo().Template().AddHtml("<h2>${data.text}: ${data.dataItem.value}</h2>"))
             )

Colors(System.String[])

Defines the default colors for the TreeMap items (tiles).

Parameters

value - System.String[]

The array of colors or color ranges.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .Colors(new string[]{ "#ff6666", "#7fb17f" })
             )

Type(Kendo.Mvc.UI.TreeMapType)

Defines the type of the layout.

Parameters

value - TreeMapType

The enum value that configures the type.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .Type(TreeMapType.Horizontal)
             )

DataSource(System.Action)

Configures the DataSource of the TreeMap.

Parameters

configurator - System.Action<HierarchicalDataSourceBuilder>

The action that configures the Kendo.Mvc.UI.Fluent.TreeMapBuilder.DataSource(System.Action{Kendo.Mvc.UI.Fluent.HierarchicalDataSourceBuilder{System.Object}}).

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .DataSource(dataSource => dataSource
                    .Read(read => read.Action("ActionName", "ControllerName"))
                    .Model(m => m.Children("Items"))
                )
             )

Events(System.Action)

Configures the handled client-side events of the TreeMap.

Parameters

configurator - System.Action<TreeMapEventBuilder>

The action that configures the available events.

Example


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

Colors(System.Action)

Defines the default colors for the TreeMap items (tiles).

Parameters

configurator - System.Action<TreeMapColorRangeFactory>

The action that configures the colors.

Example


             @(Html.Kendo().TreeMap()
                .Name("treeMap")
                .Colors(color =>
                {
                    color.AddRange("#0072c6", "#cbe2f3");
                    color.AddRange("#5db2ff", "#deeffe");
                })
             )

ToComponent()

Returns the internal view component.

Name(System.String)

Sets the name of the component.

Parameters

componentName - System.String

The name of the component.

Example


            @(Html.Kendo().Grid<OrderViewModel>()
               .Name("grid")
               .Columns(columns =>
               {
                   columns.Bound(p => p.OrderID).Filterable(false);
                   columns.Bound(p => p.Freight);
               })
               .DataSource(dataSource => dataSource
                   .Ajax()
                   .PageSize(20)
                   .Read(read => read.Action("Orders_Read", "Grid"))
               )
            )

Deferred(System.Boolean)

Suppress initialization script rendering. Note that this options should be used in conjunction with

Parameters

deferred - System.Boolean

ModelMetadata(System.Web.Mvc.ModelMetadata)

Uses the Metadata of the Model.

Parameters

modelMetadata - System.Web.Mvc.ModelMetadata

The metadata set for the Model

HtmlAttributes(System.Object)

Sets the HTML attributes.

Parameters

attributes - System.Object

The HTML attributes.

HtmlAttributes(System.Collections.Generic.IDictionary)

Parameters

attributes - System.Collections.Generic.IDictionary<String,Object>

AsModule(System.Boolean)

Specifies whether the initialization script of the component will be rendered as a JavaScript module.

Parameters

value - System.Boolean

Render()

Renders the component.

Example


            @(@Page Inherits="System.Web.Mvc.ViewPage<IEnumerable<Product>>" )
            @( Html.Kendo().Grid(Model)
                .Name("grid")
                .DetailTemplate(product => {
                    )
                       Product Details:
                       <div>Product Name: @( product.ProductName )</div>
                       <div>Units In Stock: @( product.UnitsInStock )</div>
                    @(
                })
                .Render();
            )

ScriptAttributes(System.Object,System.Boolean)

Sets the JavaScript attributes to the initialization script.

Parameters

attributes - System.Object

The JavaScript attributes.

overrideAttributes - System.Boolean

Argument which determines whether attributes should be overriden.

ScriptAttributes(System.Collections.Generic.IDictionary,System.Boolean)

Sets the JavaScript attributes to the initialization script.

Parameters

attributes - System.Collections.Generic.IDictionary<String,Object>

The JavaScript attributes.

overrideAttributes - System.Boolean

Argument which determines whether attributes should be overriden.

ToHtmlString()

ToClientTemplate()

In this article
Not finding the help you need?