Jump to content

Stacking Bar Chart: show the total value


Recommended Posts

To achieve this, you may add the following code to the DataPage Footer section. 

Please do not forget to disable the HTML editor on the Advanced tab before pasting.

<script> 
 
document.addEventListener('DataPageReady', chartUpdateHandler); 
 
function chartUpdateHandler(event) {  
 const cleaner = function (interv) { 
  clearInterval(interv); 
 } 
 
 const interv = setInterval(() => { 
  if(!Highcharts) return; 
 
  const chart = Highcharts.charts.find(chart => chart !== undefined); 
  chart.update({ 
             
 yAxis: { 
            stackLabels: { 
                enabled: true, 
                formatter: function() { 
                    return Highcharts.numberFormat(this.total, 1, ',', '.'); 
                } 
            } 
 
</script>
        }, 
  }); 
 
  cleaner(interv); 
 
 }, 200); 
} 
</script> 

Hope this helps.

 

P. S. Please note that this code should work correctly in case you have 1 Chart DataPage deployed on the web-page.

Link to comment
Share on other sites

Hello @Abdulhafeez,

I updated the code once again. Please test it. 

It looks like the issue can be related to the slow Internet. As I can see, sometimes the request for the new data for the chart works out later than the Chart is rendered. 
I am checking for the options to fix this and will update this thread as soon as I find a solution.

Thanks. 

Link to comment
Share on other sites

This is genius! Now I no longer need to look at the Y axis. Thank you!

Just wanted to add the following thread because it is related to this and the solution is displaying total value: 

 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...