Echarts参数属性学习Gird演示案例:在同一个DOM中,使用gird同时创建折线图和柱图,可高效的利用数据,同时对API的开发和对接有事半功倍的效果。
var dataAll = [//创建数据数组; [10,8,9,23,34,56,87], [30,34,45,67,45,67,32] ]; option = { title:{ text:'漏刻有时Gird演示案例', x:'center', subtext:'LockdataV Demo' }, grid:[//坐标轴位置布局 {x: '7%', y: '20%', width: '38%', height: '60%'}, {x2: '7%', y: '20%', width: '38%', height: '60%'} ], tooltip: { formatter: 'LockDataV {b}: ({c})', backgroundColor:'#ff0033' }, legend:{ data:['折线图','柱状图'], top:'10%' }, xAxis: [//X轴各图标属性 {gridIndex: 0, type: 'category',data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']}, {gridIndex: 1, type: 'category',data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']}, ], yAxis: [ {gridIndex: 0, type: 'value'}, {gridIndex: 1, type: 'value'}, ], series: [{ data: dataAll[0], xAxisIndex: 0, yAxisIndex: 0, type: 'line', name:'折线图' }, { data: dataAll[1], xAxisIndex: 1, yAxisIndex: 1, type: 'bar', name:'柱状图' }] };