Remove item in doughnut chart

[Gustavo]

Hi,

I am trying to remove an item in the chart when user click on its legend entry and put it back when user clicks again.
Same that we can do with line charts, but in a doughnut chart.

Could someone help me?

[Bivek Singh]

Gustavo,

Please take a look at this jsFiddle.

—-
Bivek Singh,
Team CanvasJS

[Gustavo]

Awesome Bivek! Thank you very much.

Now, based on your example, I am trying to do the following: https://jsfiddle.net/9vm270b9/1/

I have 2 other problems now :(
1- Why the parent div does not adjust to the canvas? (if I try other elements instead CanvasJS it works fine)
2- As I removed the Title and moved the legend to the right, there is a huge gap now on the top and on the bottom of the Chart. Is there a way to remove it?

PS.: If you prefer, we can move this discussion to another post as it became not exactly related to “Remove item in doughnut chart” anymore.

• This reply was modified 7 years ago by Gustavo.

[Bivek Singh]

Gustavo,

1- Why the parent div does not adjust to the canvas? (if I try other elements instead CanvasJS it works fine)

The height of canvas in CanvasJS Library is 400 pixels by default. That’s the reason it doesn’t adjust to it’s parent div even when you don’t provide height or width property.

2- As I removed the Title and moved the legend to the right, there is a huge gap now on the top and on the bottom of the Chart. Is there a way to remove it?

The gap also exists because of the same reason i.e. height of canvas. You can manually set the height of chartContainer. This will remove the extra gap on top and bottom of chart.

——
Bivek Singh,
Team CanvasJS

[Gustavo]

Perfect! Thank you very much.

Problem solved ;)