search

flrs / visavail

A D3.js Time Data Availability Visualization
https://flrs.github.io/visavail/docs/samples/basic.html
MIT License
310 stars 59 forks source link

Chart doesn't display title on Internet Explorer. #27

Closed affan00 closed 6 years ago

affan00 commented 6 years ago

I am using visavail chart to display online/offline status reports of cameras, but it doesn't display camera name on Internet Explorer browser, It's working fine on chrome. Thank you in advance.

Result on IE: visavail_ie_bug

Result on Chrome: screenshot from 2018-07-11 16-10-23

flrs commented 6 years ago

That's interesting. Can you see the titles in Internet Explorer in this example? (I can.) http://phatduino.com.w010a51b.kasserver.com/visavail/example.htm

affan00 commented 6 years ago

Yes, I can.

flrs commented 6 years ago

Could you post the code of the page so we can have a look?

affan00 commented 6 years ago

Yes sure, You can see the related code in this zip file. thanks :) visavail chart code.zip

affan00 commented 6 years ago

Any update?

affan00 commented 6 years ago

??

flrs commented 6 years ago

I'll have a look at it within the next 12 hours.

flrs commented 6 years ago

Hi @affan00,

Unfortunately I have no way to test your code on IE at the moment, but I do have a suspicion. If you look at line 228 of your code of visavail.js it says

      labels.append('foreignObject') // This is line 228
        .attr('x', paddingLeft)
        .attr('y', lineSpacing + dataHeight / 2)
// and so on...

The corresponding line of the current code shows: https://github.com/flrs/visavail/blob/99e793767ac12b0491fcf799b8d4ced8b96f7dc0/visavail/js/visavail.js#L241

It looks as if in your code the text was replaced with foreignObject. According to MSDN, foreignObject is not supported by IE11 and below.

I hope this helps!

affan00 commented 6 years ago

Thanks, @flrs That fixed the issue. :+1: