How to show all qtips in cytoscape.js on button click

Question

Hi I'm trying to show all qtips I have in my cytoscape.js graph when a button is clicked. Some of my elements are hidden so I need to check that they have the 'show' class first before trying to display the qtip. Here is my code

 cy.$('node[type = "net"]').forEach(function( ele ) {
          if (ele.hasClass('show')) {
             console.log(ele.id());
             ele.qtip('toggle',true);
             // i have also tried ele.qtip('show');       
      }
      });

However I am getting the following error in my browser console.

'Uncaught TypeError: Cannot read property 'set' of undefined: cytoscape-qtip.js:268'

thanks.

Answer 1

Make sure you define your qtips in advance if you use the API.

The easiest way to toggle qtips on multiple elements is custom events. Add something like qtipshow in your show event config string and use `eles.trigger('qtipshow').

You can use the same approach for hiding.

Make sure to config your qtips to show more than one at once: http://qtip2.com/options

I'm not sure what the issue is with your method using the API, since it doesn't have enough context to tell -- but events are easier to use anyway.