We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to turn off the interactive legend...

Thread ID:





129427 Mar 16,2017 10:35 PM UTC Mar 23,2017 07:32 AM UTC JavaScript 7
Tags: ejChart
Cristian Scutaru
Asked On March 16, 2017 10:35 PM UTC

...when toggleSeriesVisibility = false does not seem working? We want the legend, but series should not hide on a legend item click.

$(function () {
      legend: { toggleSeriesVisibility: false },
      series: [
        { name: "Toyota", points: [{ x: "Jan", y: 1 }, { x: "Feb", y: 3.8 }] },
        { name: "Ford", points: [{ x: "Jan", y: 2.3 }, { x: "Feb", y: 1.2 }] }

Dharanidharan Dharmasivam [Syncfusion]
Replied On March 17, 2017 07:10 AM UTC

Hi Cristian, 

Thanks for contacting Syncfusion support. 

We have analyzed your query with provided code snippet and the toggleSeriesVisibility property is working fine at our end. We have prepared a sample with respect to your requirement. In this we are having two series and specified toggleSeriesVisibility property as false. Now the series will be visible, after clicked on the legend.  

Sample used for testing can be find from below link. 

Since we are not aware of your exact scenario on which the issue is reproduced, we would like to know the following details which will helpful in further analysis and provide you the solution sooner. 
·       Modify the attached sample or provide your sample with replication steps, 
·       Revert your current Essential Studio version. 
·       Browser and its version details. 

In addition, we would like to let you know that, your requirement can also be achieved as an workaround by using legendItemClick event. In this event we need to specify the cancel property as true, so that the series visibility will not be toggled. Find the code snippet below. 


function legendClick(sender){ 
           sender.cancel = true 

Sample for reference can be find from below link. 


Cristian Scutaru
Replied On March 17, 2017 02:09 PM UTC

Hi Dharani and thanks a lot for your reply and solution.

Just FYI, I see it's all about the different files we include. I cannot use ej.web.all.min.js, because it's over 10MB and I need just the chart support. Check my included files below:

1) http://codepen.io/cristiscu/pen/BWmvxv - for some reason, toggleSeriesVisibility does not work here.

2) http://codepen.io/cristiscu/pen/oZoJMG - similar version using legendItemClick, which works! (what changed is just the line I commented out, and the new one I uncommented)

So, I'll stick with the second solution, which is fine with my reduced set of included files.

Best Regards,

Dharanidharan Dharmasivam [Syncfusion]
Replied On March 20, 2017 06:48 AM UTC

Hi Cristian, 
Thanks for your revert. 
We have analyzed your query with the provided sample. We found that, you have used Essential studio version, but we have provided support for toggleSeriesVisibility from version, so the property is not working in your sample. The current version of Essential studio is and you can switch over to latest version of our products from below link,
To achieve your requirement in your version, you can use the 2nd solution provided by us in the previous update.
And if you want script files for the particular control you can use Syncfusion custom script generator. Please find the following link 

In the below steps we have explained how to use the custom script generator. 
1. Open the above link. 
2. In the page please select the controls which you are using in your project and select the version of the ej.web.all.min.js file.


3. After selecting the controls, please click the generate button. 


4.Once the ej.web.all.min.js file is generated, please click the download button.


Now the download custom script
will contain the source code of selected Syncfusion controls alone. And you can use that in your sample.


Cristian Scutaru
Replied On March 21, 2017 10:12 PM UTC

Thanks a lot, Dharani.

Do you also publish individual versioned files on a CDN? I found it convenient the previous version was on one of your CDNs.

I'm interested only in ejChart and ejCircularGauge.

Best Regards,

Dharanidharan Dharmasivam [Syncfusion]
Replied On March 22, 2017 07:33 AM UTC

Hi Cristian, 
Thanks for your revert.  
As per your request, we have listed the CDN links for chart and circular gauge below. 
Also to render the chart control, you need to refer core, data and globalize scripts and to render circulargauge, you need to refer core script only. 
Since chart and circular gauge are data visualization, you need to use datavisualization/chart and datavisualization/cirulargauge in the above link. 
And If you need any web related controls like grid, then you need to use web/ej.grid.js in the above link. 

Note: is the current version. You can use version with respect to your requirement. To know more on version details, follow the link below. 

If you are using version, then use the below links and replace for other controls as stated above. 

Also in version, to render chart control, you need to refer globalize. Find the link below 
If you still face any concerns, revert us the Essential studio product version you were using, which will be helpful for analyzing and to provide the exact solution sooner. 

Cristian Scutaru
Replied On March 22, 2017 05:26 PM UTC

Thanks, Dharani. You're a life saver! :)

Dharanidharan Dharmasivam [Syncfusion]
Replied On March 23, 2017 07:32 AM UTC

Hi Cristian, 

Thanks for your update. 

Kindly revert us, if you need further assistance. 



This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

or the page will be automatically redirected to sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon