Customizing widget tooltips to include the full form of a value

[Ophir_Buchman]

When formatting your widgets you might choose to display values using K/M/B/T abbreviations. When doing so, the corresponding tooltips display the values in the same format. In case you want to show the full-form number, use the following dashboard script:

// The number of decimal places to round to (Example: 2 means 100.1234 rounds to 100.12)
const decimalPlaces = 2 

// Add the thousands devider (Example: true means 12345 is displayed as 12,345)
const addThounsandSeperator = true 

function is_numeric(str){
  return /^\d+$/.test(str);
}

function numberWithCommas(x) {
  x = x.toString();
  var pattern = /(-?\d+)(\d{3})/;
  while (pattern.test(x))
    x = x.replace(pattern, "$1,$2");

  return x;
}

dashboard.on('widgetready', function(dash,widget) {
  // Ignore pie & BloX charts
  if (widget.widget.type === 'chart/pie' || widget.widget.type === 'BloX') return;

  widget.widget.on('beforedatapointtooltip', function(widget,data) {
    // Round number
    newValue = Math.round( data.context.pointScope.y * Math.pow(10,decimalPlaces)) / Math.pow(10,decimalPlaces);

    // Add thousands seperator
    if (addThounsandSeperator) newValueString = numberWithCommas(newValue)
    else newValueString = newValue.toString()

    // Add currency mark (if exists)
    if (!is_numeric(data.context.points[0].value[0]))
    newValueString = data.context.points[0].value[0] + newValueString

    // Update the tooltip datasource
    data.context.points[0].value = newValueString
  });
});

Before	After