Using async callback on the Forge Dataviz API

Question

In trying to add my custom data to a heatmap using the new Forge Datavisualization API, but I'm having issues trying to use an async function to link the data to the heatmap.

I want to call an async fetch function inside the getSensorValue callback. If I just return a Math.random() it works:

function getSensorValue(surfaceShadingPoint, sensorType) {
        
        return Math.random();
    }

But whenever I try to add any awaitable function it won't render any surface shading:

[...]
     function normalizeValue(value, min, max) {
        return (value - min) / (max - min);
    }

     async function getSensorValue(surfaceShadingPoint, sensorType) {
        let data = await asynchronousFunction();
        data = data[data.length-1]
        let temperature = (data[0].temperature);
        return normalizeValue(temperature,19,37);
    }
[...]

    setInterval(async function () {
        const floorName = 'A1_Level 1';
        dataVizExt.renderSurfaceShading(floorName, sensorType, await getSensorValue);
    }, 1000);

And I've also tried using Promises like this with no success... :

function getSensorValue(surfaceShadingPoint, sensorType) {
        return (promise = new Promise((resolve, reject) => {
            resolve(asynchronousFunction());
        }));
    }
    function normalizeValue(value, min, max) {
        return (value - min) / (max - min);
    }

    setInterval(function () {
        const floorName = 'A1_Level 1';
        dataVizExt.renderSurfaceShading(floorName, sensorType, () =>
            getSensorValue().then((res) => {
                let data = res;
                data = data[data.length - 1];
                let temperature = data.temperature;
                return normalizeValue(temperature,22,40);
            })
        );
    }, 1000);

Do I have any misconception on the API or am I messing up my JS async logic?

user_14605307 · Answer

Okay so I've made it. It's not the most elegant nor the most beautiful solution but it works.

//function that gets the data and formats it for the heatmap
async function getSensorValue() {
    let data = await asynchronousFunction();
    data = data[data.length - 1];
    let temperature = data.temperature;
    return normalizeValue(temperature,22,40);
}
//global variable that holds the last temperature value from the server
var normalizedValue;
//non async function that just returns the global variable. 
//(It has to be function because the API expects it as a callback)
function getVar(surfaceShadingPoint, sensorType){
    return normalizedValue;
  }
//function that normalizes any value between 2 numbers
function normalizeValue(value, min, max) {
    return (value - min) / (max - min);
}
//interval that tries to get new data from the server each X seconds.
setInterval(async function () {
    normalizedValue = await getSensorValue();  
    if(normalizedValue){         
        const floorName = 'A1_Level 1';
        dataVizExt.renderSurfaceShading(floorName, sensorType, getVar)
    }
}, 2000);

I don't know when or if you'll be able to use async function on this specific endpoint of the Dataviz Extension, but this makes the work I need right now.

Using async callback on the Forge Dataviz API

1 Answers