Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Plotly change value of "reference:"

I want to change the value of the "reference" tag off a gauge in my ESP32 code.
The gauge:

var humidityData = [
  {
    domain: { x: [0, 1], y: [0, 1] },
    value: 0,
    title: { text: "Feuchtigkeit" },
    type: "indicator",
    mode: "gauge+number+delta",
    delta: { reference: 69 },
    gauge: {
      axis: { range: [40, 103] },
      steps: [
        { range: [10, 65], color: "red" },
        { range: [65, 68], color: "yellow" },
        { range: [68, 75], color: "lightgreen" },
        { range: [75, 78], color: "yellow" },
        { range: [78, 103], color: "red" },
      ],
    },
  },
];

The code that should update the reference:

function updateGauge(temperature, humidity, humidity_soll) {
  var temperature_update = {
    value: temperature,
  };
  var humidity_update = {
    value: humidity,
    reference: humidity_soll,
  };
  Plotly.update(temperatureGaugeDiv, temperature_update);
  Plotly.update(humidityGaugeDiv, humidity_update);
}

But the reference is still the initial one. It is not updated by the function with the new value from the json i handed over correctly.
Changing the simple "value" tag ist no problem. But the "reference" tag is not updated. Maybe I have to do this another way?
Any suggestions for me?
Its my first implementation of plotly.io so far.
So sorry for the noob question…

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

Kind regards
Frank

>Solution :

You are trying to update the gauge by passing a new reference value at the top level of the update object. But, Plotly expects the reference value to be nested under the delta attribute, matching the structure used when you first defined the chart, so you need to use 'delta.reference' as a key.

function updateGauge(temperature, humidity, humidity_soll) {
  var temperature_update = {
    value: temperature,
  };

  var humidity_update = {
    value: humidity,
    'delta.reference': humidity_soll,
  };

  Plotly.update(temperatureGaugeDiv, [temperature_update]);
  Plotly.update(humidityGaugeDiv, [humidity_update]);
}
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading