gauge.js
gauge.js copied to clipboard
Multiple needles: different colors?
Thank you for the trick of sending an array of value instead of a value to the .set() method. It is working perfectly!
Do you have any idea how we could differentiate the colors of these 2 needles? I would need to have the first needle of one color, and the second of another color.
Thanks for the help
Originally posted by @lorenzo11 in https://github.com/bernii/gauge.js/issues/127#issuecomment-428665580
Well, I'm not quite sure how little you can get away with. First check the GaugePointer class' render function. In there you see how the pointer is drawn and that the color is taken directly from the options object.
As far as I remember, each pointer more or less lives its own life. This means that you could consider to override each options.color property in the gauge.set method when the pointers' values and options are updated.
Adding to Kplindegaard said. This does indeed work, but you are working with un-named pointers. So the trick is to set the color then initialize the pointer. The result will give you colored pointers (/needles).
Keep in mind that you must initialize the gauge with the first color in the option set from when you pass options in or you won't be able to change that first color.