Axs label rendering

[jsu]

Hi Team,

I need to hide the X and Y axis labels only in mobile view (or when the browser shrinks and window size becomes lower).

Can you please me help on this?

Thanks

[Kesavan Muthusamy]

Hi Jsu, 

Thanks for using Syncfusion products. 

We have analyzed your query. As of now we don’t have options hide entire axis labels. But  You can set labelIntersectAction to "Hide" for axis in load event by checking whether sample is loaded in mobile not.  It will hide the labels which intersected with adjacent labels. 

Please find the following code snippet.  

Index.cshtml 

<div id="container"> 

   @Html.EJS().Chart("container") 

 

       // other chart customization 

       .Load("load").Render() 

</div> 

<script> 

    function load(args) { 

        args.chart.primaryXAxis.labelIntersectAction = ej.base.Browser.isDevice ? 'Hide' : 'None'; 

        args.chart.primaryYAxis.labelIntersectAction = ej.base.Browser.isDevice ? 'Hide' : 'None'; 

    } 

     

</script> 

 

Please let us know, if you have any concern on this. 

Regards, 

Kesavan 

[jsu]

Thanks Keshavan.

Also in mobile view I need to disable the pagination property of legends. 

Could  you please advise how to set pagination property false for the legends?

[Dharanidharan Dharmasivam]

Hi Jsu,  

 

We have analyzed the enquired requirement. We would like to let you know that, currently there is no option to disable the pagination. When the legend size is increased, then pagination will be visible, this is our default behavior. However, you can specify the size (height/width) to legend based on the device. Find the code snippet below to achieve this requirement. 

 

 

@Html.EJS().Chart("container") 

      //Other configurations 

.Load("load").Render() 

 

function load(args) { 

        args.chart.legendSettings.width = ej.base.Browser.isDevice ? "50%" : "100%"; 

        args.chart.legendSettings.height = ej.base.Browser.isDevice ? "50%" : "100%"; 

    } 

 

 

This can be modified based on your scenario. 

 

Thanks, 

Dharani.