ECharts简单使用

代码（ECharts工具类）

/**
 * Created by Administrator on 2017/8/16.
 */
// 柱状图
function createBarChart(widthNum, heightNum, chartId, eTitle, eSubTitle, eLegend, exAxis, eyAxis, myStore) {
    var rotate = 0;
    if (exAxis.length > 6) {
        rotate = 25;
    }
    return Ext.create('Ext.panel.Panel', {
        border: false,
        layout: {
            align: 'center',
            pack: 'center',
            type: 'vbox'
        },
        items: [
            {
                xtype: 'panel',
                align: 'center',
                html: '<div id="' + chartId + '" style="width: ' + widthNum + 'px;height: ' + heightNum + 'px"></div>',
                listeners: {
                    afterRender: function () {
                        // 初始化echarts
                        var barChart = echarts.init(document.getElementById(chartId));
                        // 显示加载
                        barChart.showLoading({
                            text: 'Loading',//显示加载中的文字
                            effect: 'spin',//加载中的显示样式
                            textStyle: {
                                fontSize: 20
                            }
                        });
                        // 指定图表的配置项和数据
                        var optionBar = {
                            // 标题
                            title: {
                                text: eTitle,
                                subtext: eSubTitle,
                                x: 'center'
                            },
                            // 提示
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {  //坐标轴指示器，坐标轴触发有效
                                    type: 'shadow' // 默认为直线，可选为'line' | 'shadow'| 'cross'
                                }
                            },
                            // 边框
                            grid: {
                                left: '3%',
                                right: '5%',
                                bottom: '9%',
                                containLabel: true
                            },
                            // 图例
                            legend: {
                                orient: 'horizontal',
                                x: 'center',