0

Im in trouble with the use of jQuery Flot with a Twitter Bootstrap template, because all runs perfectly on Chrome, but on IE 10 and Firefox it doesn´t. :(

I´ve tried too many inspects, looking some solution on Google, without any light... so Im claiming here for some help!

You´re gonna understand what Im talking about if you run these 2 cases on Chrome, FF and IE:

First Case - PIE Graph:

http://www.frontsite.com.br/ccee/relatorio2013/30-comercializacao-30.html

Perfect on Chrome, but on IE and FF it becomes a totaly black circle. (?!)

Second Case - SERIES Type

http://www.frontsite.com.br/ccee/relatorio2013/30-comercializacao-20.html

Perfect on Chrome, but on IE and FF the lines becomes GREY. (?!)

Third Case - BARs Type - Runs fine! :)

http://www.frontsite.com.br/ccee/relatorio2013/30-comercializacao-85.html

Its the only correct case that runs perfect on both three browsers. :)

I really spent too much time inspecting this problem, and now Im using this channel to take some professional help... could someone help me? Any lights???

Thanks. Daniel

Siguza
  • 21,155
  • 6
  • 52
  • 89
Massa
  • 3,670
  • 1
  • 17
  • 16

2 Answers2

2

Your colors are not specified correctly, you have a trailing semi-colon ("#1572bf;" should be "#1572bf"):

var dados1 = [
    { label: "<b>Comercialização</b> 75,4%",  data: 75.4, color: "#1572bf;<-- THIS IS INVALID" },
    { label: "<b>Distribuição</b> 2,0%",  data: 2, color: "#bfd730;<-- THIS IS INVALID" },
    { label: "<b>Geração</b> 22,6%",  data: 22.6, color: "#f99d33;<-- THIS IS INVALID" }
];

Here's a before and after fiddle.

Mark
  • 106,305
  • 20
  • 172
  • 230
0

You might check these other links - I found them helpful when I experienced the same issue.

grid : {
    background    : 'transparent',
    gridLineColor : '#c5c5c5'
}
Community
  • 1
  • 1
user3677385
  • 1