visible: Boolean

Sets the visibility of dataSeries. Data Series is visible by default and you can hide the same by setting visible property to false.

Default: true
Example: true, false 
var  chart =  new  CanvasJS.Chart("container",
{
 .
 .
 data: [{
   visible: false,
   .
   .
  }],
 .
 . 
});
chart.render();

In the below example first data series is hidden by setting visible property to false. You can try un hiding the same by changing it to false.

Try Editing The Code
Tip

  Also See:    

If you have any questions, please feel free to ask in our forums.Ask Question

6 Comments

  1. Trever says:

    How could you set it up so that when you click on one of the legend items, two of the dataSeries are made visible or invisible?

  2. bob says:

    I have a line graph with multiple lanes that have a shared tool tips. When I hide one line, or many, they still display in tool tips. Is there a way to make it not display in tool tips if its visibility is set to false?

  3. Matthew says:

    Is there a way to hide/unhide series other than through the legend click event. For example if I wanted to turn off a series by a button click. Is this possible?

    Thanks

    • Sanjoy says:

      Matthew,

      It is quite possible to hide/unhide dataSeries through any event. Just in the implementation of the eventHandler you have to set the visible property of the dataSeries to false/true that you want to hide/unhide

      Here is an example

      • Matthew Bayles says:

        Thanks for the help. For anyone having problems I had to modify the code. In my code I had to click the button twice in order to get the series to hide/ unhide properly and then it worked normally. This may be because I am adding my data dynamically. To fix the issue I had to set the visibility parameter to true when I added the series as its undefined at first. Now the code works as expected.

If you have any questions, please feel free to ask in our forums. Ask Question