top of page

Columns chart with Fixed Placement

Here is a method to convert a column chart to fixed placement columns (Chart showing overlapping placement of columns).



Steps:

  1. Create a column chart (select Classic column type in design panel)

  2. Add below script to widget

  3. Save the script and refresh widget


widget.on('processresult', function(se, ev){
	ev.result.plotOptions.column.grouping = false
	ev.result.tooltip.shared = true
	ev.result.tooltip.enabled = true
	
	$.each(ev.result.series, function(index, value){
		value.borderWidth = 1
		value.borderColor = value.color
		value.pointPadding = 0.1 * (index+1)
		
		$.each(value.data, function(dataIndex, dataValue){
			dataValue.color = Highcharts.color(dataValue.color).setOpacity(0.6).get('rgba')
			
		})
		
		value.color = Highcharts.color(value.color).setOpacity(0.6).get('rgba')
		
	})
})

widget.on("beforedatapointtooltip", function (se, args){
	args.cancel=true;
});

308 views0 comments

Recent Posts

See All
bottom of page