top of page

Format data labels

Here is a script to format data labels of widgets.

Supported widget types : Line chart, Bar chart, Column chart, Area chart






Steps:

  1. Create a widget

  2. Add below script to widget. Update the variable `borderColor` and 'backgroundColor' if required.

  3. Save the script and refresh the widget


widget.on('processresult', function(se, ev){

	$.each(ev.result.series, function(seriesIndex, seriesValue){
		
			if(seriesIndex == 0){
				borderColor = '#94FF77'
				backgroundColor = 'rgba(148, 255, 119, 0.2)'
			}else if(seriesIndex == 1){
				borderColor = '#FFB4B4'
				backgroundColor = 'rgba(255, 180, 180, 0.2)'
			}
		
		
			seriesValue.dataLabels = {
										borderColor: borderColor,
										backgroundColor: backgroundColor,
										borderWidth: 1,
										borderRadius:3,
										padding: 3,
										style: {
											fontWeight: 'bold'
										}
			}

	})

})

195 views0 comments

Recent Posts

See All
bottom of page