var myChart = echarts.init(document.getElementById('testDIV')); //初始化echarts頁面顯示的空間

//------------------------- begin-----------------------------

            var myOption = {
                    backgroundColor: "#eee",  // echarts圖表的背景顏色，默認(rèn)為透明
                    tooltip : {
                        trigger: 'axis',
                        axisPointer : {       // 坐標(biāo)軸指示器，坐標(biāo)軸觸發(fā)有效
                            type : 'shadow'  // 默認(rèn)為直線，可選為：'line' | 'shadow'
                        }
                    },
                    legend: {    //用于標(biāo)題的
                        data: ['交警', '武警','協(xié)警'],
                        textStyle: {  
                            color: '#fff'          //legend字體顏色 
                        }
                    },
                    grid: {
                        left: '3%',
                        right: '7%',
                        top:'15%',
                        bottom: '15%',
                        containLabel: true
                    },
                    xAxis:  {
                        type: 'value',
                        // x軸的字體樣式
                        axisLabel: {        
                                show: true,
                                textStyle: {
                                    color: '#fff',
                                    fontSize:'16'
                                }
                            },
                        // 控制網(wǎng)格線是否顯示
                        splitLine: {
                                show: false, 
                                //  改變軸線顏色
                                lineStyle: {
                                    // 使用深淺的間隔色
                                    color: ['red']
                                }                            
                        },
                        // x軸的顏色和寬度
                        axisLine:{
                            lineStyle:{
                                color:'#fff',
                                  width:3,   //這里是坐標(biāo)軸的寬度,可以去掉
                            }
                        }
                    },
                    yAxis: {
                        type: 'category',
                        data: ['福田','南山','羅湖','鹽田','龍華','寶安','龍崗'],
                        // y軸的字體樣式
                        axisLabel: {
                                    show: true,
                                    textStyle: {
                                        color: '#fff'
                                    }
                               },
                        // y軸的顏色和寬度
                        axisLine:{
                            lineStyle:{
                                color:'#fff',
                                  width:1,                  //這里是坐標(biāo)軸的寬度
                            }
                        }
                    },
                    series: [
                        {
                            name: '交警',
                            type: 'bar',
                            stack: '總量',
                            label: {
                                normal: {
                                    show: true,
                                    position: 'insideRight'
                                }
                            },
                            data: [320, 302, 301, 334, 390, 330, 320]
                        },
                        {
                            name: '武警',
                            type: 'bar',
                            stack: '總量',
                            label: {
                                normal: {
                                    show: true,
                                    position: 'insideRight'
                                }
                            },
                            data: [120, 132, 101, 134, 90, 230, 210]
                        },
                        {
                            name: '協(xié)警',
                            type: 'bar',
                            stack: '總量',
                            label: {
                                normal: {
                                    show: true,
                                    position: 'insideRight'
                                }
                            },
                            data: [220, 182, 191, 234, 290, 330, 310]
                        },
                    ]
                };


myChart.setOption(myOption); // 將圖標(biāo)顯示在頁面上 

xAxis:  {
        type: 'value',    //這行代碼表示該軸的類型為value
        // x軸的字體樣式
        axisLabel: {        
                    show: true,    //這行代碼控制著坐標(biāo)軸x軸的文字是否顯示
                      textStyle: {
                          color: '#fff',   //x軸上的字體顏色
                          fontSize:'16'    // x軸字體大小
                      }
                  },
        // 控制網(wǎng)格線是否顯示
         splitLine: {
                 show: false,   // 網(wǎng)格線是否顯示
                 //  改變樣式
                 lineStyle: {
                     color: '#ccc'   // 修改網(wǎng)格線顏色     
                 }                            
         },
       // x軸的顏色和寬度
       axisLine:{
           lineStyle:{
               color:'#fff', // x坐標(biāo)軸的軸線顏色
               width:3,      //這里是坐標(biāo)軸的寬度,可以去掉
           }
       }
    },
     //也可以在以上代碼的軸線中加入：
     // 隱藏坐標(biāo)軸
     axisLine: {
         show: false
         },
     // 去除坐標(biāo)軸上的刻度線
     axisTick: {
          show: false
     }       

坐標(biāo)軸中的 type 可以為value或者category， 即確定該軸為值軸或者類目軸，
example： 在一個坐標(biāo)系中的條形圖中：
x軸為男生，女生等類別選項，那么該軸就為類目軸，
y軸為類別的數(shù)量或者其他值類(諸如年齡，身高等等)，就為值軸。