Unable to get Tooltips to appear


« Back to message list

Enter your email address to get email updates on this topic. You can stop receiving updates by clicking the link in the update email messages.

Posted by Philip Wiggins on 21st October 2015
I'm unable to get the tooltips to appear. I though initially it might be a background color issue, but I have the background set to a color other than white for tooltips. All the parts parts are in variables. When I hover over a tick mark I get a little white dot as if something is triggering. But still no luck.

This is my tooltip array via consoling out the variable:
["<div><b>Sales: </b>20188.7800</div>", "<div><b>Sales: </b>16923.4400</div>", "<div><b>Sales: </b>16030.6300</div>", "", "", "", "", "", "", "", "", "", "", "<div><b>Budget: </b>13800</div>", "<div><b>Budget: </b>12800</div>", "<div><b>Budget: </b>12800</div>", "<div><b>Budget: </b>11878.810000000001</div>", "<div><b>Budget: </b>11816.32</div>", "<div><b>Budget: </b>16121.59</div>", "<div><b>Budget: </b>13973.98</div>", "<div><b>Budget: </b>13379.75</div>", "<div><b>Budget: </b>17438.15</div>", "<div><b>Budget: </b>14579.9</div>", "<div><b>Budget: </b>13968.65</div>", "<div><b>Budget: </b>17201.32</div>", "<div><b>Budget: </b>12557.189999999999</div>"]


And my setup to draw the graph:
  var line = new RGraph.Line({
                         id: 'sales_line_graph',
                         data: [sales_display, budget_display],
                         options: {
                             numxticks: num_ticks,
                             colors: ["#3366FF","#66CC00"],
                             'background.color': 'white',
                             tooltips: tooltips,
                             gutterLeft: 60,
                             gutterRight: 100,
                             gutterBottom: 100,
                             labels: labels_display,
                             textAngle: 45,
                             spline: false,
                             hmargin: 5,
                     }
                 }).draw();
Posted by Richard on 21st October 2015
Hi,

At a guess you may not have included the RGraph.common.tooltips.js and/or the RGraph.common.dynamic.js files.

PS Whilst you're getting it up and running I would suggest changing your tooltips to something simple like this:

...
tooltips: ['a','b','c','d','e']
...

And once it's working put in the HTML.

Richard
Posted by Philip Wiggins on 21st October 2015
I have both of the files added. And I simplified the tooltip array. This is from the graph properties from consoling out   var line.

www.dropbox.com/s/8mgitb6d2lvs807/Screenshot%202015-10-21%2014.02.15.png?dl=0
Posted by Philip Wiggins on 21st October 2015
Also I meant to mention that this is in a JQUERY modal/dialog. Would that contribute to the issue? The graph draws fine, just having issues with the tooltips.
Posted by Richard on 21st October 2015
Hi,

> Also I meant to mention that this is in a JQUERY
> modal/dialog. Would that contribute to the issue?

A little yes. Maybe the z-index of the dialog is higher than the z-index of the tooltips. Try adding this to the page:

.RGraph_tooltip {
     z-index: 99999 !important;
}

If it is this though that z-index may not be high enough. So you'll need to inspect the dialog, determine its z-index and use something higher.



Richard
Posted by Philip Wiggins on 21st October 2015
As always you are GREAT!! Doing the following resolves the issue.

     .ui-dialog { z-index: 1000 !important ;}
     .RGraph_tooltip {
         z-index: 99999 !important;
         background-color: #217ba8 ! important;

     }
Posted by Richard on 21st October 2015
Hi,

> As always you are GREAT!!

Well y'know, I try... :-) If you'd be so kind as to add a testimonial (if you haven't already) I'd be grateful.

www.rgraph.net/testimonials

Thanks.

Richard

Add a reply

 




« Back to message list
RGraph on social media