echarts 加入下拉列表_切换下拉列表重新渲染echarts

HTML代码

第7天

第6天

第5天

第4天

第3天

第2天

第1天

Javascript代码

var myChart = echarts.init(document.getElementById('home'));

$(function() {

$('#select').on('change', function() {

var val = $(this).val();

_ajax(8-val);

});

});

function _ajax(len) {

$.ajax({

url: 'data/test.json',

type: 'get',

success: function(res) {

var xData = [];

var yData = [];

for (var i = 0; i < len; i++) {

xData.push(res.rows[i].by_value.slice(5));

}

for (var n = 0, m = 8-len; n < len; n++) {

yData.push(res.rows[n].cells[m].percent);

}

myChart.setOption({

xAxis: {

type: 'category',

boundaryGap: false,

data: xData

},

tooltip: {},

yAxis: {

type: 'value'

},

series: [{

name: '最高气温',

type: 'line',

data: yData

}]

});

}

});

}

test.json

{

"by_field": "",

"has_first_day": true,