[Retool mobile] Transformer and hover value do not match for JS query

Queries and Resources
,
1

image

2

Hello @ali-sajjad-rizavi!

That is odd, let my try to replicate this and see where the bug might be coming from.

Is the 7719.45... values used or found anywhere else in the code?

What kind of query is getDistanceFromSelectedOutlet?

Can you share the full preview of getDistanceFromSelectedOutlet.data to see if the other properties are correct?

Are you doing any math of would there be any reason for the values to change? The previewer might be lagging behind the true value. Just to confirm 5315061.303.... is the correct value that you are expecting to return, yes?

3

Here are the contents of getDistanceFromSelectedOutlet.data.

/*
This query runs on periodic intervals, only if there's any selected
outlet.
*/

function getDistanceFromLatLonInMeters(lat1, lon1, lat2, lon2) {
  const R = 6371; // Radius of the Earth in kilometers
  const dLat = deg2rad(lat2 - lat1);  // deg2rad below
  const dLon = deg2rad(lon2 - lon1); 
  const a = 
    Math.sin(dLat/2) * Math.sin(dLat/2) +
    Math.cos(deg2rad(lat1)) * Math.cos(deg2rad(lat2)) * 
    Math.sin(dLon/2) * Math.sin(dLon/2); 
  const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)); 
  const distance = R * c; // Distance in kilometers
  return distance * 1000;
}

function deg2rad(deg) {
  return deg * (Math.PI/180);
}


let curr_position = await utils.getCurrentPosition()
let outlet = outletCollectionView.selectedItem

return {
  // Also specifying outlet code, just in case we need to validate
  // the distance in various app logic.
  outlet_code: outlet.card_code,
  
  distance_m: getDistanceFromLatLonInMeters(
    curr_position.coords.latitude,
    curr_position.coords.longitude,
    outlet.lat,
    outlet.lon
  )
}
4

@ali-sajjad-rizavi Thank you for sharing!

I believe the issue is that a transformer will only update the data it returns when it is run again, it can cache the previous results and then display this.

I would recommend moving over your code logic to a JS Query block to see if the result and preview on hover are consistently the same and correct. The state of the JS Query can also be viewed and will update on run as well.

Hope this helps!