Set Opacity of columns in a column chart

[Silutions]

Anyone have a script to do this?

I've tried the script below but it does not function for series0 on my widget:

widget.on("beforeviewloaded", function(w, args){

args.options.series[0].fillOpacity: 0.5

}

);

I've also tried just "opacity" without success.  Works on the HightCharts demo, but not in Sisense.

Grateful for any assistance., Jim

[harikm007 · Accepted solution]

@Silutions Here is an alternate way to set opacity of column/bar chart

widget.on('ready', function(se,ev){
	
 opacity = '0.3'

 $('.highcharts-series-group .highcharts-series', element).css('fill-opacity', opacity) //change opacity of bars
 $('.highcharts-legend .highcharts-legend-item', element).css('fill-opacity', opacity) //change opacity of legend

});

[harikm007 · Accepted solution]

@Silutions Here is an alternate way to set opacity of column/bar chart

widget.on('ready', function(se,ev){
	
 opacity = '0.3'

 $('.highcharts-series-group .highcharts-series', element).css('fill-opacity', opacity) //change opacity of bars
 $('.highcharts-legend .highcharts-legend-item', element).css('fill-opacity', opacity) //change opacity of legend

});

[Silutions · Accepted solution]

harikm007,

Works like a champ.  Thanks so much.

Regards, Jim

[cartercjb]

@harikm007 how do you apply the opacity to only the chart and now the data label?

[harikm007]

@cartercjb ,

Please try this updated script

widget.on('ready', function(se,ev){
	
 opacity = '0.3'

 $('.highcharts-series-group .highcharts-series rect', element).css('fill-opacity', opacity) //change opacity of bars
 $('.highcharts-legend .highcharts-legend-item rect', element).css('fill-opacity', opacity) //change opacity of legend

});

-Hari

[cartercjb]

Thanks, Hari @harikm007 . Just curious, what does the "rect "mean that you added? 

[harikm007]

@cartercjb ,

'rect' is an element in SVG used to create rectangle. In above script we are applying opacity only to the rectangle, not labels.

-Hari