1、引入

<script type="text/javascript" src="/Common/echarts/echarts.js?v=636474012741000281"></script>

2、新增容器

<div id="main" style="height:100%;width:100%"></div>	

3、讀資料，顯示圖示

// 基於準備好的dom，初始化echarts圖表
	        var myChart = echarts.init(document.getElementById('main'));

	        var option = {
	            title: {
	                text: '投資計劃完成情況'
	            },
	            tooltip: {
	                show: true
	            },
	            toolbox: {
	                show: true,
	                feature: {
	                    mark: { show: true },
	                    //dataView: { show: true, readOnly: false },
	                    magicType: { show: true, type: ['line', 'bar'] },
	                    //restore: { show: true },
	                    saveAsImage: { show: true }
	                }
	            },
	            legend: {
	                data: ['計劃', '實際']
	            },
	            xAxis: [
                        {
                            type: 'category',
                            data: []
                        }
                    ],
	            yAxis: [
                        {
                            type: 'value', name: '單位（億）'
                        }
                    ],
	            series: [
                        {
                            "name": "計劃",
                            "type": "bar",
                            "data": []
                        },
                         {
                             "name": "實際",
                             "type": "bar",
                             "data": []
                         }
                    ]
	        };
	        // 為echarts物件載入資料 
	        myChart.setOption(option);
	        myChart.showLoading();
	        //載入資料
	        var x = [];    //投資公司
	        var y1 = [];    //計劃
	        var y2 = [];    //實際

	        $G.dispatcher({
	            action: "GetTZJHWCQK",
	            showMask: false,
	            //args: [changeSum[0]],
	            success: function (data) {

	                for (var i = 0; i < data.length; i++) {
	                    x.push(data[i].DWMC);    //單位
	                    y1.push(data[i].JHMB);    //計劃
	                    y2.push(data[i].SJWC);    //實際
	                }

	                myChart.hideLoading();    //隱藏載入動畫

	                myChart.setOption({        //載入資料圖表
	                    xAxis: {
	                        data: x
	                    },
	                    series: [{
	                        name: '計劃',
	                        data: y1
	                    },
                        {
                            name: '實際',
                            data: y2
                        }
                        ]
	                });

	            }
	        });