Showing results for 
Search instead for 
Did you mean: 
Community Team Member
Community Team Member
When our chart x-axis have long labels, by default the SISense Web application will not render the entire label. For this, we can use the following script which wraps the text and breaks the text line for every other white space. In addition, the legend will sort revers in horizontal stacked bar charts, for this, the second part of the script will reverse the original sorting of the legend values, so as to adequately show the legend according to the stacked values.
One note, in order to sort the legend, you'll need to replace the seriesName variable with the name of the dimension which you're breaking by, currently it's set as 'Percent'
Place the following script in the widget's script box
//the following element wraps the label text
widget.on('beforeviewloaded', function (widget, ev) {
 var newMaxCharactersPerLabel = 100;
 ev.options.xAxis.labels.maxCharactersPerLabel = newMaxCharactersPerLabel;
 ev.options.xAxis.labels.useHTML = true;

 ev.options.xAxis.labels.formatter = function () {
  var text = this.value;
  var newText = "";
  var array = text.split(" ");
  for (i = 0; i < array.length; i++) {
   if (i % 2 == 1 && array.length > 1) {
    newText += array[i - 1] + ' ' + array[i] + '';
   else if(array.length == 1){
    newText = array[i];
  return newText;
//the following element sorts the legend accordingly, make sure to replace the 
//seriesName variable with the name of the dimension which you're breaking by, currently it's set as 'Percent'
var seriesName = 'Percent';
ev.result.series.sort(function(b,a){return; });

  var series = ev.result.series;
 var numberOfSeries = ev.result.series.length;
 for(var i=0;i < numberOfSeries;i++){
  series[i].legendIndex = numberOfSeries - i;
 var data = _.find(ev.result.series, function (ser) {return == seriesName}).data 
_.each(data, function(value){ 
//enable dataLabels, change its font, make it bold and rotate by 270 
value.dataLabels = {enabled:true, style:{'fontSize':'50px', 'fontWeight':'bold'}, rotation: 0} 

Sisense Team Member
Sisense Team Member

To display the legend in reverse order the following script can be applied:


More details about the parameter can be found here:

Version history
Last update:
‎03-02-2023 09:14 AM
Updated by:
Community Toolbox

Recommended quick links to assist you in optimizing your community experience:

Developers Group:

Product Feedback Forum:

Need additional support?:

Submit a Support Request

The Legal Stuff

Have a question about the Sisense Community?

Email [email protected]

Share this page: