Ext JS |带附加数据的下载图表

// 创建一个折线图
var chart = Ext.create('Ext.chart.CartesianChart', {
    store: {
        fields: ['year', 'value'],
        data: [
            { year: 2010, value: 10 },
            { year: 2011, value: 20 },
            { year: 2012, value: 30 }
        ]
    },
    axes: [{
        type: 'numeric',
        position: 'left',
        fields: ['value'],
        title: 'Value'
    }, {
        type: 'category',
        position: 'bottom',
        fields: ['year'],
        title: 'Year'
    }],
    series: [{
        type: 'line',
        xField: 'year',
        yField: 'value'
    }]
});

// 创建一个按钮，用于下载图表和附加数据
var downloadButton = Ext.create('Ext.Button', {
    text: 'Download Chart with Data',
    renderTo: Ext.getBody(),
    handler: function() {
        // 获取图表数据
        var chartData = chart.getStore().getData().items;

        // 获取附加数据
        var additionalData = [
            { description: 'Total Value', value: 60 },
            { description: 'Average Value', value: 20 }
        ];

        // 创建一个 Blob 对象，包含图表数据和附加数据
        var blob = new Blob([JSON.stringify(chartData), JSON.stringify(additionalData)], { type: 'application/json' });

        // 创建一个下载链接
        var link = document.createElement('a');
        link.href = URL.createObjectURL(blob);
        link.download = 'chart_with_data.json';

        // 触发下载
        link.click();
    }
});