Hello,
I am trying to utilize the Cylinder Widget. The user will need to specify the max height of their tank. My original plan was to utilize the Input Control module, but I am not sure if that is correct.
What is the proper way to ask the user to input the tank height, and utilize this info in the range value for the Cylinder Widget?
Hi thomas,
In the cylinder widget you can pick the lower and upper limits through the use of the variable metadata.
For example here I have a custom widget with the upper and lower limits being controled by the variables metadata:
So then if I send the following data to my device:
[
{
“variable”: “tank”,
“value”: “125”,
“metadata”: {
“limit_inferior”: “25”,
“limit_superior”: “75”
}
}
]
It creates the following:
Where the tanks amount is the value, and the lower and upper values are the limit_superior and limit_inferior.
A way you can ask a user to specify the tank size is to have a input form which receives the tank size and then calls an analysis to add the specified value to the variable being used. Notice that you can either use the original variable that has the value or a new variable:
So you could for example have an analysis like the one below:
const { Analysis, Resources } = require(“@tago-io/sdk”);
/**
* This analysis expects two variables from an input form and adds their values to a new variable, `tank_limits`.
* The values are added to the `tank_limits` metadata using `limit_inferior` and `limit_superior`.
*
* @param {TagoContext} context - The Tago context object.
* @param {Data} scope - The scope containing data from the dashboard and actions.
*/
async function tankLimitsAnalysis(context, scope) {
if (!scope.length) return console.error(“No data provided.”);
const deviceID = scope[0].device; // Assuming all data comes from the same device.
const limitInferior = scope.find(data => data.variable === “limit_inferior”);
const limitSuperior = scope.find(data => data.variable === “limit_superior”);
if (!limitInferior || !limitSuperior) {
return console.error(“Required variables ‘limit_inferior’ or ‘limit_superior’ not found.”);
}
const tankLimitsMetadata = {
limit_inferior: limitInferior.value,
limit_superior: limitSuperior.value,
};
// Adding the tank height value as 0, as per requirement.
await Resources.devices.sendDeviceData(deviceID, {
variable: “tank_limits”,
value: 0,
metadata: tankLimitsMetadata,
});
}
Analysis.use(tankLimitsAnalysis);
// Remember to enable Access Policies for the Analysis.
It will receive two variables from an input form and generate the variable with the configured metadata.
Hope this helps!
