Sign in to follow this  
Mahtab

Tooltip Is Not Working When The Chart Is Inserted Into A Fancybox

Recommended Posts

Hi everybody,

 

I am using FusionCharts in an asp.net application.

 

Everything is working fine ecxept the automatic ToolTip.

The problem showed up when I started rendering my chart inside an asp.net page that is loaded into a fancybox.

 

I used the following code to show the chart, but no tooltip shows up :

 

 

var myChart = new FusionCharts(chartType, divId + "Chart", "600", "450", "0");

myChart.setXMLData(chartDescription);

 

myChart.render(divId);

 

I have even tried to use the jquery plugin and insert the whole chart into the page (which is loaded in fancybox) like this :

 

 

$("#" + divId).insertFusionCharts({

swfUrl: chartType,

renderer: "JavaScript",

dataSource: chartDescription,

dataFormat: "xml",

width: "600",

height: "450",

id: divId + "Chart"

});

 

But still no success with the tooltip!!!

 

Any help is appreciated, its frustrating!

 

Thanks in advance

Mahtab

Edited by Mahtab

Share this post


Link to post
Share on other sites

Ok, seems like no one could help me, but this morning I could solve my own problem thanks to this link : http://stackoverflow...-modal-fancybox

 

It is the "z-index" property that decides the order of elements on the page.

The z-index of the tooltip was 999 which is less than the z-index of fancybax.

Giving a z-index greater than the one fancybox has, brings the tooltip up on the chart :)

I hope this helps someone else who is having the same problem.

 

Have a nice day

Mahtab

 

 

Hi everybody,

 

I am using FusionCharts in an asp.net application.

 

Everything is working fine ecxept the automatic ToolTip.

The problem showed up when I started rendering my chart inside an asp.net page that is loaded into a fancybox.

 

I used the following code to show the chart, but no tooltip shows up :

 

 

var myChart = new FusionCharts(chartType, divId + "Chart", "600", "450", "0");

myChart.setXMLData(chartDescription);

 

myChart.render(divId);

 

I have even tried to use the jquery plugin and insert the whole chart into the page (which is loaded in fancybox) like this :

 

 

$("#" + divId).insertFusionCharts({

swfUrl: chartType,

renderer: "JavaScript",

dataSource: chartDescription,

dataFormat: "xml",

width: "600",

height: "450",

id: divId + "Chart"

});

 

But still no success with the tooltip!!!

 

Any help is appreciated, its frustrating!

 

Thanks in advance

Mahtab

Share this post


Link to post
Share on other sites
Guest Sashibhusan

Hi Mahtab,

 

We are glad to hear that you have managed of your own to resolve your issue.

 

Your solution would really help others, who is facing similar issues.

 

Please do let us know if we could be of any further help.

Share this post


Link to post
Share on other sites

Hi again,

 

Thanks for your message Sashibhusan :)

 

I'm now having a similar problem with the export menu in javascript charts.(the one that comes up after clicking on the export button and is like : save as a pdf, save as img etc)

 

The export menu is now covered by the fancybox and I cannot solve the problem on the same way that I did for the tooltip.

Thats because I could set the z-index of the tooltip element but I find no way to do the same thing with the export menu.

 

Can anyone help me with the issue?unsure.gif

 

/Mahtab

Share this post


Link to post
Share on other sites
Guest Sashibhusan

Hi Mahtab,

 

We are glad to hear that you have managed of your own to resolve your issue.

 

Happy FusionCharting!:)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this