Can I use different colors for each side of a Bipolar chart?


« 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 Harold on 16th January 2016
Is it possible to have each side of a Bipolar a different color? One side is positive and the other is negative, so I'm thinking Red and Green.
Thanks....
Posted by Richard on 16th January 2016
Hi,

Yes - you can use the colorsSequential option. IIRC they're used from top to bottom, left side first.

Richard
Posted by Juan on 24th May 2016
Not working for me, thats my code:

new RGraph.Bipolar({
             id: 'id',
             left: datosHombres,
             right: datosMujeres,
             options: {
                 colors: ['red','red','red','red','red','red','red','red','red','red',
                          'blue','blue','blue','blue','blue','blue','blue','blue','blue','blue'],
                 textAccessible: true,
                 textSize: 14,
                 gutterCenter: 90,
                 axisColor: 'rgba(0,0,0,0)',
                 labels: etiquetas,
                 colorsSequential:true
             }
         }).wave();
Posted by Juan on 24th May 2016
Solved the issue by changing some library code(RGraph.Bipolar.js):

968 // If chart.colors.sequential is specified - handle that
                 if (prop['chart.colors.sequential']) {
                  var offsetColors = 0;
                  if (prop['chart.colors'].length == this.right.length * 2) {
                   offsetColors = this.right.length;
                  }
                     co.fillStyle = prop['chart.colors'][offsetColors + i];
                 } else {
                     co.fillStyle = prop['chart.colors'][0];
                 }
Posted by Neal on 21st January 2018
This only works if you specify the correct number of colors for the bars on each side. I would like to just specify a left and a right color regardless of the number of bars. I have it partially working with this code:

if (prop['chart.colors.sequential']) {
                   var offsetColors = 0;
                   if (prop['chart.colors'].length == 2) {
                    offsetColors = 1;
                   }
                      co.fillStyle = prop['chart.colors'][offsetColors + i];
                  } else {
                      co.fillStyle = prop['chart.colors'][0];
}

With this the first bar on the right always has the wrong color though but it is closer. Anyone got a solution.
Posted by Richard on 21st January 2018
Hi there,

If I understand what you're asking then this example should do it for you:

www.rgraph.net/tests/canvas.bipolar/colors.html

(view the source)

Richard
Posted by Neal on 21st January 2018
That appears to work but I still need a modification in RGraph.bipolar.js
Posted by Richard on 21st January 2018
Hi there,

What did you modify?

Richard
Posted by Neal on 21st January 2018
This is what I have in there at the moment:

if (prop['chart.colors.sequential']) {
                   var offsetColors = 0;
                   if (prop['chart.colors'].length >= this.right.length * 2) {
                    offsetColors = prop['chart.colors'].length/2 ;
                   }
                      co.fillStyle = prop['chart.colors'][offsetColors + i];
                  } else {
                      co.fillStyle = prop['chart.colors'][i];
}

Looks like the code I am using came from RGraph.minified-2017-05-08.zip will give it a go if I replace all the code with the latest 4.65 version.
Posted by Neal on 21st January 2018
If I use RGraph.minified-2017-05-08.zip it works (as in no errors but doesn't color bars correctly) but 4.65 (2017-11-25) version gives a Uncaught TypeError:
text.repace is not a function.

Add a reply




« Back to message list