Skip to main content

Label Formatting

Loading
Options
X-Axis Fotmatting
Y-Axis Fotmatting

Source Code
(Live update based on the above Options change)

import { Chart } from 'singledivui';
import 'singledivui/dist/singledivui.min.css';

const options = {
    type: "bar",
    data: {
        labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun"],
        series: {
            points: [15000, 9000, 25000, 18000, 31000, 25000]
        }
    },
    graphSettings: {
        labelDistance: 15,
        xAxis: {
            labelFormatter: function(value) {
                return value.toUpperCase();
            }
        },
        yAxis: {
            startFromZero: true,
            gridLineSize: 0,
            axisLineSize: 0,
            labelFormatter: function(value) {
                return '$ ' + value.toLocaleString('en-US');
            }
        }
    }
};

new Chart('#chart-demo', options);