echarts柱状图线形图例子

<script type='text/javascript' src="http://echarts.baidu.com/build/dist/echarts.js"></script>

 var myChartbar;
var myChartline;
//bar
require(['echarts','echarts/theme/macarons','echarts/chart/bar'], function (ec){
myChartbar = ec.init(document.getElementById('bar'),'macarons');
var option = {
//标题
   title : {
       text: '柱状图',
       //字体 颜色 大小
       textStyle: {fontWeight: 'normal',color: '#009999'},
       subtext: ''
   },
   tooltip : {
       trigger: 'axis'
   },
   //图例
   legend: {

        selectedMode:false,

        //文字颜色

        textStyle: {color: '#009999'},

        data:['图例1', '图例2']

    },
   toolbox: {
       show : true,
      
   },
   calculable : true,
   //格子
   grid:{borderWidth:0},
   xAxis : [
       {
           type : 'category',
           //不顶行显示
           boundaryGap : true,
           //X轴名称设置
           name:'日期',
           nameTextStyle:{color:'#009999'},
           //X轴文字字体颜色设置
           textStyle:{color:'#009999'},
           axisLabel:{textStyle: {color:'#009999',fontSize: 8,},},
           //不显示分行线
           splitLine: {show: false},  
           //X轴数据
           data : ['1','2','3','4','5']
       }
   ],
   yAxis : [
       {
           type : 'value',
           //Y轴名称
           name:'次',
           nameTextStyle:{color:'#009999'},
           //Y轴字体颜色大小
           axisLabel:{textStyle: {color:'#009999',},},
           splitLine: {show: false},
       }
   ],
   series : [

        {
           name:'图例1',
           type:'bar',
           stack: 'sum',
           barCategoryGap: '30%',
           //设置柱形图的颜色，文字颜色
           itemStyle : { normal: {color: '#009999',label : {show: true, position: 'insideTop',textStyle: {color: '#cce8cf'}} }},
           //Y轴数据
           data:['23','1','20','13','14']

        },

        {
           name:'图例2',
           type:'bar',
           stack: 'sum',
           itemStyle: {

                normal: {

                    color: '#00688B',}

        },
           //Y轴数据
           data:['3','2','21','3','4']

        }
]
};
//line

myChartbar.setOption(option);

        });
require(['echarts','echarts/theme/macarons','echarts/chart/line'], function (ec){
myChartline = ec.init(document.getElementById('line'),'macarons');
var option1 = {
//线形图颜色（可以是多个）
color: ['#009999'],
//标题
   title : {
       text: '线形图',
       textStyle: {fontWeight: 'normal',color: '#009999'},
       //副标题
       subtext: ''
   },
   tooltip : {
       trigger: 'axis'
   },
   legend: {
    textStyle: {color: '#009999'},
data:['图例']
   },
   toolbox: {
       show : true,
      
   },
   calculable : true,
   grid:{borderWidth:0},
   xAxis : [
       {
           type : 'category',
           //顶行显示
           boundaryGap : false,
           splitLine: {show: false},
           data:['1','2','3','4','5']
       }
   ],
   yAxis : [
       {
           type : 'value',
           splitLine: {show: false},
       }
   ],
   series : [
       {
           name:'图例',
           type:'line',
           smooth:true,
           data: data:['3','2','21','3','4']，
           itemStyle:{
           
normal:{
           
// a（系列名称），b（类目值），c（数值）, d（无）
           
label:{show:true,position:'top',formatter:'{c}'},
           
areaStyle: {type: 'default'},
           
label : {

                        show: true, 

                        position: 'top',

                        textStyle: {

                            color: '#99ff00'

                        }
           
}
           
}
       
}
       
}
    ]
};
myChartline.setOption(option1);

        });