Forge Autodesk_Error_Customtooltip - autodesk-forge

Question

Does anyone know how to fix the error. My goal is to put some graphs in a customtooltip.
I have taken the variables from the example on the web. I don't know what is causing me to not be able to see the customtooltip.
Thank you
const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
const DataVizCore = Autodesk.DataVisualization.Core;
const DataVizUI = Autodesk.DataVisualization.UI;
function onSpriteHovering(event) {
const targetDbId = event.dbId;
var id = targetDbId;
var xcoord = 262.76056690205695;
var ycoord = 357.1343908626808;
var hoveredDeviceInfo = {
id,
xcoord,
ycoord
}
var currentDeviceData = {
"Device-01": {
"CO₂": "495.71 ppm",
"Humidity": "34.33 %RH",
"Temperature": "21.18 Celsius"
}
};
var chartData = {
"Device-01": {
name: "",
properties: {
"CO₂": {
dataUnit: "ppm",
seriesData: [{
value: [1612396800000, 492.55117490452676],
label: {}
},
{
value: [1612400400000, 494.27072441289187],
label: {}
}
],
yAxis: {
dataMin: 450,
dataMax: 680
}
},
"Humidity": {
dataUnit: "%RH",
seriesData: [{
value: [1612396800000, 34.58961659380417],
label: {}
}],
yAxis: {
dataMin: 25,
dataMax: 50
}
},
}
}
};
const bocadilloemergente = new DataVizUI.CustomToolTip(hoveredDeviceInfo, chartData, currentDeviceData);
}
Error in the console:

Answer 1

The variable was defined in a different context, and not available during the mouse event. The customtooltip is shipped using react component not data visualization extension so you need refer to the react component package to use the tooltip.
Look here
Install the package