5

I used below code to render zingchart which works fine.

zingchart.render({ 
    id : 'myChart', 
    data : myConfig, 
    height: 400, 
    width: "100%"
});

Now in some occasion I want to un render or detach it. I Mean when I click on some specific place this div with id myChart should be empty and zing chart should be removed from it.

How can i achieve it?

I tried this jquery code as well.

$("#myChart").html('');

Thanks in advance.

Imran Qamer
  • 2,253
  • 3
  • 29
  • 52

1 Answers1

7

Full disclosure, I'm a member of the ZingChart team.

Deleting the DOM element the chart is attached to will not delete the chart from memory. At this point you will have something along the lines of a dangling reference. You achieve proper destruction using our api method destroy

zingchart.exec('myChart','destroy');
nardecky
  • 2,623
  • 8
  • 18
  • Kindly have a look on following question http://stackoverflow.com/questions/39786277/can-i-render-multiple-charts-by-single-renderfunction-call-in-zing-charts – Imran Qamer Sep 30 '16 at 07:46
  • Thanks it worked for me, I added star on github aswell – Imran Qamer Oct 01 '16 at 10:23
  • 1
    Hi [nardecky](https://stackoverflow.com/users/5712661/nardecky), Is there any why I could destroy all zingchart on a single page at once? – Vikas Gupta Jan 08 '21 at 07:06
  • 1
    I believe the best way would be to save id's of charts. So you have an array of id's OR you could add a class to the container div, a naming pattern. Then you could do something like `document.querySelectorAll('.chart-class')` and loop through each HTML element grabbing the `id` property. – nardecky Jan 14 '21 at 05:56