top of page

Gradient color in bar/column/line/area chart

Below script will add gradient color to widget. Supported widget types are bar chart, column chart, line chart and area chart



Steps:

  1. Create bar/column/line/area chart

  2. Add below widget script and update the variable 'color1' with any color you need to add as gradient. Primary color is the color you selected in Sisense value/breakby panel.

  3. Save the script and refresh widget



widget.on('processresult', function(se,ev){
	
	var color1 = '#3399ff'
	
	$.each(ev.result.series, function(seriesIndex, seriesValue){
		
		seriesValue.color = {
			linearGradient: {
				x1: 0,
				y1: 0,
				x2: 0,
				y2: 1
			},
			stops: [
				[0, seriesValue.color],
				[1, color1]
			]
		}
		
		$.each(seriesValue.data, function(index, value){
			value.color = seriesValue.color
		})	
	})
})


Comments

Rated 0 out of 5 stars.
No ratings yet

Add a rating
BI Next Level white logo

BI Next Level is your trusted resource for BI customization, data solutions, and expert insights. Explore practical tips, scripts, and tutorials for tools like Sisense, Python, and SQL. Let’s transform your data into impactful insights together.

Quick Links
Connect with us
Copyright © 2024. All Rights Reserved. Designed, Developed & Maintained  by Intertoons
bottom of page