Issue with highlighting dynamically

[node1coza]

Hi I'm trying to update the highlights with a function and it doesn't throw any errors but the highlight doesn't change. There can be any number of segments that need colour between various degrees. If I hardcode 4 or more they work perfectly but creating the array and passing it in inst working.

Here is my code

function colourSector() {

 var strHighlights = [];
 var strColor = 'rgba(54,255,75,1)';
  for (i = 0; i < secStart.length; i++)
  {
    strHighlights.push({from: secStart[i], to: secEnd[i], color: strColor});
  }

  var guage = document.gauges.get("canvas1");
  var hl = [];
  hl.push({highlights: strHighlights});
  guage.update(JSON.stringify(hl));

}

[bumpyconstant]

Try “from”: x, “to”: y etc.

[gkujawsk]

@node1coza - did you managed to get over the reported issue? It seems that it's not possible to reconfigure the highlight ranges dynamically. Whenever I try to update the gauge with new highlights the highlight just disappears. All the other options appear to update dynamically without any issues. It looks like a bug for me.

[node1coza]

Hi Sent from my Huawei phoneHi GabrielNo I didnt. I basically destroy and recreate the Guage to fill in the highlights-------- Original message --------From: Gabriel Kujawski notifications@github.comDate: Wed, Mar 25, 2020, 16:24To: Mikhus/canvas-gauges canvas-gauges@noreply.github.comCc: node1coza me@johnscott.co.za, Mention mention@noreply.github.comSubject: Re: [Mikhus/canvas-gauges] Issue with highlighting dynamically (#189) @node1coza - did you managed to get over the reported issue? It seems that it's not possible to reconfigure the highlight ranges dynamically. Whenever I try to update the gauge with new highlights the highlight just disappears. All the other options appear to update dynamically without any issues. It looks like a bug for me.

—You are receiving this because you were mentioned.Reply to this email directly, view it on GitHub, or unsubscribe.

[mjroeting]

I use this:

        var green = "rgba(0, 255, 0, .3)";
        var yellow = "rgba(192, 192 , .3)";
        var red = "rgba(255, 0, 0, .3)";
        var blue = "rgba(0, 0, 255, .3)";

var Highlights = []; Highlights.push({ from: 0, to: 10, color: red }); Highlights.push({ from: 10, to: 40, color: yellow }); Highlights.push({ from: 40, to: 45, color: green }); Highlights.push({ from: 45, to: 50, color: blue });

gauge = new RadialGauge({ highlights: Highlights, });