How to get the value from a color range scale when the value changes? (fusioncharts)

Question

I have a fusion map that has a color range scale (from 0 to 3,000,000,000).

When I adjust the scale (on the UI), I would like to get the value that is shown on the scale.

I would preferably like to capture it in an event.

I thought the event would have a name such as 'colorRangeUpdated', 'valueChange', 'colorRangeScaleUpdate', or 'getColorRangeValue' but I don't think any of these events exist.

How to get the value from a color range scale when the value updates? (e.g. the user slides the left or right slider to a different value).

Is there an event for this? What is it called?

(Here is a perfect example of a fusion map which has a sliding color scale) https://www.fusioncharts.com/fusionmaps/examples/average-temperature-of-us-states

I have already created events such as 'entityRollover' and 'entityRollout' but I didn't see any events related to the color range scale in the documentation https://www.fusioncharts.com/dev/api/fusioncharts/fusioncharts-events

Answer 1

With the help of the legendRangeUpdated event you can get the updated value from a color range scale. See also JS fiddle.

const dataSource = {
  chart: {
    caption: "Average Temperature of US States",
    subcaption: "1979 - 2000",
    entityfillhovercolor: "#F8F8E9",
    numbersuffix: "°F",
    showlabels: "1",
    borderthickness: "0.4",
    theme: "fusion",
    entitytooltext:
      "<b>$lname</b> has an average temperature of <b>$datavalue</b>"
  },
  colorrange: {
    minvalue: "20",
    code: "#00A971",
    gradient: "1",
    color: [
      {
        minvalue: "20",
        maxvalue: "40",
        code: "#EFD951"
      },
      {
        minvalue: "40",
        maxvalue: "60",
        code: "#FD8963"
      },
      {
        minvalue: "60",
        maxvalue: "80",
        code: "#D60100"
      }
    ]
  },
  data: [
    {
      id: "HI",
      value: "70.0"
    },
    {
      id: "DC",
      value: "52.3"
    },
    {
      id: "MD",
      value: "54.2"
    },
    {
      id: "DE",
      value: "55.3"
    },
    {
      id: "RI",
      value: "50.1"
    },
    {
      id: "WA",
      value: "48.3"
    },
    {
      id: "OR",
      value: "48.4"
    },
    {
      id: "CA",
      value: "59.4"
    },
    {
      id: "AK",
      value: "26.6"
    },
    {
      id: "ID",
      value: "44.4"
    },
    {
      id: "NV",
      value: "49.9"
    },
    {
      id: "AZ",
      value: "60.3"
    },
    {
      id: "MT",
      value: "42.7"
    },
    {
      id: "WY",
      value: "42.0"
    },
    {
      id: "UT",
      value: "48.6"
    },
    {
      id: "CO",
      value: "45.1"
    },
    {
      id: "NM",
      value: "53.4"
    },
    {
      id: "ND",
      value: "40.4"
    },
    {
      id: "SD",
      value: "45.2"
    },
    {
      id: "NE",
      value: "48.8"
    },
    {
      id: "KS",
      value: "54.3"
    },
    {
      id: "OK",
      value: "59.6"
    },
    {
      id: "TX",
      value: "64.8"
    },
    {
      id: "MN",
      value: "41.2"
    },
    {
      id: "IA",
      value: "47.8"
    },
    {
      id: "MO",
      value: "54.5"
    },
    {
      id: "AR",
      value: "60.4"
    },
    {
      id: "LA",
      value: "66.4"
    },
    {
      id: "WI",
      value: "43.1"
    },
    {
      id: "IL",
      value: "51.8"
    },
    {
      id: "KY",
      value: "55.6"
    },
    {
      id: "TN",
      value: "57.6"
    },
    {
      id: "MS",
      value: "63.4"
    },
    {
      id: "AL",
      value: "62.8"
    },
    {
      id: "GA",
      value: "63.5"
    },
    {
      id: "MI",
      value: "44.4"
    },
    {
      id: "IN",
      value: "51.7"
    },
    {
      id: "OH",
      value: "50.7"
    },
    {
      id: "PA",
      value: "48.8"
    },
    {
      id: "NY",
      value: "45.4"
    },
    {
      id: "VT",
      value: "42.9"
    },
    {
      id: "NH",
      value: "43.8"
    },
    {
      id: "ME",
      value: "41.0"
    },
    {
      id: "MA",
      value: "47.9"
    },
    {
      id: "CT",
      value: "49.0"
    },
    {
      id: "NJ",
      value: "52.7"
    },
    {
      id: "WV",
      value: "51.8"
    },
    {
      id: "VA",
      value: "55.1"
    },
    {
      id: "NC",
      value: "59.0"
    },
    {
      id: "SC",
      value: "62.4"
    },
    {
      id: "FL",
      value: "70.7"
    }
  ]
};

FusionCharts.ready(function() {
  var myChart = new FusionCharts({
    type: "usa",
    renderAt: "chart-container",
    width: "100%",
    height: "100%",
    dataFormat: "json",
    dataSource,
    
      "events": {
      "legendRangeUpdated": function(dataObj) {
      
          alert(dataObj.data.minValue);
      }
    } 
  }).render();
});

Answer 2

I found out the name of the event that I was looking for, 'legendRangeUpdated'. https://www.fusioncharts.com/dev/api/fusioncharts/fusioncharts-events