Sencha chart에 title 추가하기

2024. 11. 20. 23:40Javascript/Sencha

Ext.create('Ext.chart.CartesianChart', {
    renderTo: Ext.getBody(),
    width: 600,
    height: 400,
    title: {
        text: 'My Chart Title', // Title text
        style: {
            fontSize: '16px', // Optional: Set the font size
            fontWeight: 'bold' // Optional: Make the title bold
        },
        align: 'center' // Optional: Align the title ('left', 'center', 'right')
    },
    store: {
        fields: ['name', 'value'],
        data: [
            { name: 'Item 1', value: 10 },
            { name: 'Item 2', value: 20 },
            { name: 'Item 3', value: 30 }
        ]
    },
    axes: [
        {
            type: 'numeric',
            position: 'left',
            title: {
                text: 'Values',
                style: {
                    fontSize: '12px'
                }
            }
        },
        {
            type: 'category',
            position: 'bottom',
            title: {
                text: 'Items',
                style: {
                    fontSize: '12px'
                }
            }
        }
    ],
    series: [
        {
            type: 'bar',
            xField: 'name',
            yField: 'value'
        }
    ]
});