Appearance
Sample: Percent axis
100% stacked bar with pinned 0–100 ticks every 25 and % postfix.
Live preview
Code
html
<div id="chart" style="width:800px;height:480px"></div>
<script type="module">
import { Insight } from 'https://unpkg.com/@chartbuddy.io/embed';
new Insight('#chart', {
chartData: {
chartType: 'stackedBar100',
isDataTransposed: true,
seriesData: [
['', 'Q1', 'Q2', 'Q3', 'Q4'],
['Product', 40, 42, 45, 48],
['Services', 35, 33, 32, 30],
['Other', 25, 25, 23, 22],
],
title: { visible: true, text: 'Mix by quarter' },
subtitle: { visible: false, text: '' },
axes: {
left: {
labels: {
preferredTickInterval: 25,
customMin: 0,
customMax: 100,
numberFormat: {
mode: 'custom',
customFormat: {
postfix: '%',
decimalPlaces: 0,
forceDecimals: false,
thousandSeparator: ',',
decimalSeparator: '.',
signDisplay: 'auto',
scaleDown: 0,
prefix: '',
},
},
},
gridlines: { visible: true, dashArray: '' },
},
},
},
});
</script>Docs: Value axis · By chart type