Forum Discussion

harikm007's avatar
harikm007
Data Warehouse
07-15-2022

Add description to Widget

Here is a method to add detailed information about the chart and data that will always appear at the bottom of a widget.

Refer: https://www.binextlevel.com/post/add-description-to-widget

Steps:

 
  1. Create widget

  2. Add below script to widget.

  3. Update text to be displayed and set format of text

  4. Save the script and refresh widget

 

descriptionSpace = 80

widget.on('processresult',function(se,ev){
	ev.result.chart.spacingBottom = descriptionSpace//to add required space to display description at bottom
})

//Bottom description
widget.on('domready', function(w, args){
	text = 'This is a description. This is a description. This is a description. This is a description. This is a description. This is a description. This is a description. This is a description. This is a description. '
	chart = w.chart[0][Object.keys(w.chart[0])[0]].hc
	chart.renderer.text(text, 15, chart.chartHeight - descriptionSpace+20)
		.css({
			width: chart.chartWidth-15,
			color: '#a0a0a0',
			'font-style': 'italic'
		  })
		.add();
});

 

 

Also you can add subtitle to a widget: https://www.binextlevel.com/post/add-subtitle-to-widget

-Hari

 

3 Replies

Replies have been turned off for this discussion
    • harikm007's avatar
      harikm007
      Data Warehouse

      gwolfe This script works with charts that are created using Highchart libraries. May be the histogram is using some other libraries like d3.

  • jmn3's avatar
    jmn3
    Cloud Apps

    how can I modify this code to run on a pivot widget?