TreeMap width

[Karthick]

Hi,

I am drawing a TreeMap dynamically. If there are multiple functions and applications then the content gets wrapped and the UI doesn't look good. Please find the attached sample. Is there any way that I can add more functions and the TreeMap gets adjusted automatically so that it looks legible and better.

Thanks,

Karthick

Attachment: TreeMap_2353702f.zip

[Saravana Kumar Kanagavel]

  

Hi Karthick, 

 

Thanks for contacting Syncfusion Support. 

We have analyzed your query and achieved your requirement by using “TextOverFlow” property in LeafItemSetting. By using this property, you can hide or wrap the exceeding word in tree map. 

 

Please refer the code example below 

 

[Client Side] 

@(Html.EJ().TreeMap("treemap") 

     .LeafItemsSetting(lls => 

             { 

                  .TextOverflow(LabelTextOverflow.Wrap) 

           }) 

 

 

 

Kind find the below link to know more details about TextOverFlow property. 

 

Link : https://help.syncfusion.com/js/treemap/treemap-elements#customizing-the-overflow-labels 

 

And we have prepared the sample for your reference and attached in the below location. 

 

Sample Link : http://www.syncfusion.com/downloads/support/forum/133039/ze/Sample-129856935 

  

Please find the output of the sample below 

 

 

Please let us know if you have any concern. 

 

Regards, 

Saravana Kumar K. 

                                                                

[Karthick]

Thank You Sarava Kumar for your response. In this example which you provided there are 5 sections (countries in the below example) which actually fit well within a row. I have close to 12 sections in my input and even TextOverFlow also gets crunched. Now, i divided the input into 3 and created 3 treemaps in views and assigned the value. Is there any better option to do that?

[Saravana Kumar Kanagavel]

Hi Karthick, 

 

Thanks for your revert. 

 

We have tried the 12 sections in a row to replicate the reported issue but not able to reproduce the reported issue at our end. Thus all labels are hided or wrapped properly into the particular slice container. 

 

And we have tried to replicate the sample from the below. 

Sample Link :  

 

Please find the output of the sample below 

  

 

And if you still face any concern, kindly revert us with issue reproducing runnable sample or modified the attached sample along with replication steps and this will be easy helpful to find the issue and to provide the exact solution sooner. 

 

Please let us know if you have any concern. 

 

Regards, 

Saravana Kumar K. 

 

[Saravana Kumar Kanagavel]

Hi Karthick, 

  

Please find the sample from the below link 

  

Sample Link : http://www.syncfusion.com/downloads/support/forum/133039/ze/Sample1192781791  

  

Thanks, 

Saravana Kumar K.