Treemap API

[Christopher]

Hi,

 I am currrently evaluating the TreeMap control. I am interested in using it in an AngularJS application. I could not find much documentation on the API. The following link leads to a 404 error. http://www.telerik.com/support/code-library/kendo-ui/treemap

 

Basically I would like to know if I customize the template of each cell. Rather than having only one label in each cell, could I have a few labels, each with different font and size?

Is there a click event? When a user clicks on a cell, I'd like that to be directed to another page.

I could only see a basic usage of the Treemap. Is there an advanced sample available?

Thanks,

Chris

[Damien]

Hi,

We need also this functionnality: have the click event to get detail information about the leaf.

Thanks a lot.

[Daniel]

Hi,

The API documentation is available on this page. You can customize the content by using a template. A built-in click event is not available but you could bind a custom one and get the item via the dataItem method. I created an example that demonstrates using a template and handling the click event.


Regards,
Daniel
Telerik

 

 

[Christopher]

Thanks! This was helpful.

[Ron]

I am unable to open the link you gave for the example. Is there anyway you can attach the example in a file?

[Daniel]

Hi,

I attached the example.

Regards,
Daniel
Telerik

 

 

[Rajaraman]

But how do i get the current selected item in the TreeMap, if its not the first or last

 template: $("#template").html()}).on("click", ".k-leaf, .k-treemap-title", function (e) {

                    alert('clicked');
                    var geographyTreeMap = $("#geographyTreeMap").getKendoTreeMap();
                    var dataItem = geographyTreeMap.dataItem(".k-treemap-tile:first");
                    alert(dataItem); //is working
                
            });​

[Daniel]

Hello,

The example that I attached demonstrators how to get the clicked item. The event handler will be called in the context of the element that triggered the event so you can use this to get the element.

.on("click", ".k-leaf, .k-treemap-title", function (e) {
    var item = $("#treemap").data("kendoTreeMap").dataItem($(this).closest(".k-treemap-tile"));
});

Regards,
Daniel
Telerik