' + txt + ' ' + params[0].value return html }, axisPointer: { type: 'none' } }, grid: { top:'20', left: '0', right: '0', bottom: '24', containLabel: true }, xAxis: [ { type: 'category', data: hoursTxt48, axisLabel: { show: true, padding: [4, 0, 0, 0], textStyle: { color: '#666', fontSize: 12 } }, axisLine: { lineStyle: { color: '#dfeaf1' } }, axisTick: { show:false, alignWithLabel: false }, } ], yAxis: [ { type: 'value', axisLabel: { show: true, textStyle: { color: '#666', fontSize: 12 } }, axisLine: { lineStyle: { color: '#dfeaf1' } }, axisTick: { show: false, alignWithLabel: true }, splitLine: { show: true, lineStyle: { color: '#dfeaf1', type: 'dotted' } }, } ], series: [ { type: 'bar', data: hoursData48, barWidth: 10, itemStyle: { normal: { color: function(params) { var val = params.data; if(val <= aqiColor1){ return colorList[0]; } else if(val > aqiColor1 && val <= aqiColor2){ return colorList[1]; } else if (val > aqiColor2 && val <= aqiColor3) { return colorList[2]; } else if (val > aqiColor3 && val <= aqiColor4) { return colorList[3]; } else if (val > aqiColor4 && val <= aqiColor5) { return colorList[4]; } else if (val > aqiColor5 && val <= aqiColor6) { return colorList[5]; } else if (val >= aqiColor6) { return colorList[6]; } } } } } ] }; js_aqiChart4824.setOption(option);