- Highcharts Essentials
- Bilal Shahid
- 156字
- 2021-08-05 17:35:53
Negatively stacked bar charts
In this example, we will compare the average book consumption data for the year 2014 with the year 2012 using negative stacking. Copy the code from the previous example and include the data series for the year 2012, as shown in the following code:
series: [{ name: '2014', data: [16, 17, 18, 13,15, 21] }, { name: '2012', data: [-14, -15, -19, -19, -14, -19] }]
To enable negative stacking, the data series must contain values in negative. We can now enable the stacking in the plotOptions
component, as shown in the following code:
plotOptions: { series: { dataLabels: { enabled: true, formatter: function() { return this.y + '%'; } }, stacking: 'normal' } }
However, the negatively stacked bars won't show until we change the min
property in yAxis
from 0
to -25
.
Refresh the page and you should see a negatively stacked bar chart, as shown in the following screenshot:

推薦閱讀
- CockroachDB權(quán)威指南
- GraphQL學(xué)習(xí)指南
- iOS 9 Game Development Essentials
- C語言程序設(shè)計(第2版)
- 深入淺出WPF
- Learning Apache Kafka(Second Edition)
- 算法訓(xùn)練營:提高篇(全彩版)
- SQL Server與JSP動態(tài)網(wǎng)站開發(fā)
- Windows Phone 8 Game Development
- Scala編程實戰(zhàn)
- 交互式程序設(shè)計(第2版)
- C語言程序設(shè)計實踐
- TypeScript圖形渲染實戰(zhàn):2D架構(gòu)設(shè)計與實現(xiàn)
- Oracle Database XE 11gR2 Jump Start Guide
- 一步一步學(xué)Spring Boot:微服務(wù)項目實戰(zhàn)(第2版)