HumbleSoftware / Flotr2

Graphs and Charts for Canvas in JavaScript.
http://www.humblesoftware.com/flotr2/
MIT License
2.44k stars 526 forks source link

Newer versions does not show gradient fillColors correctly in vert. bar #189

Open zealot128 opened 11 years ago

zealot128 commented 11 years ago

After updating flotr2.js to the newest version, the gradient fill colors are rendered incorrectly:

Correct (flotr.js from Oct 20 2012) : flotr2 correct

Uncorrect using newest version https://raw.github.com/HumbleSoftware/Flotr2/master/flotr2.min.js or https://raw.github.com/HumbleSoftware/Flotr2/master/flotr2.js

flotr1 wrong

The gradient should be rendered from red ("0") to green ("1") over the full bar.

Both flotr.js are version "1.1.4" according to the constant inside the code.

Here is the full code:

      balken = {
        data: [[0.6, 0]],
        bars: {
          show: true,
          horizontal: true,
          fillColor: {
            start: "top",
            end: "bottom",
            colors: [[0.0, "#ff0000"], [0.5, "#ffff00"], [1.0, "#00ff00"]]
          },
          fillOpacity: 0.7,
          lineWidth: 0
        },
      };
      options = {
        yaxis: {
          showLabels: null
        },
        grid: {
          verticalLines: null,
          horizontalLines: null,
          outlineWidth: 2,
          outline: "s"
        },
        xaxis: {
          min: -0.05,
          max: 1.05,
          showLabels: false
        }
      };
      Flotr.draw(target, [balken], options);
cesutherland commented 11 years ago

Hello Stefan, I'm not sure what's going on here. Could you post two fiddles with the working and non-working reproductions?

You can fork http://jsfiddle.net/cesutherland/ZFBj5/