javascript - 点击事件，不能绑定echarts的图表方法？

Question

同一个ID，多次点击，每次点击显示不同的图表。
现在的问题是：只有最后一个会显示图表，其它的图表都报“Uncaught TypeError: Cannot set property 'getColor' of null”这个错误。

如果只放一个点击事件，那么对应的点击事件的图表会正常显示； 五个同时点击，只最后一个显示，前面四个都报错

//昨日click
function yesterdayDate() {
    document.getElementById('title').value = getYesterdayDate(new Date());
    fetYesterdayData();

如果只是昨日的这个点击事件，是可以正常显示的。

同一个ID ，这个ID里放多个echarts

<p id="itemEchart" class="Reportp" style="margin-bottom: 10px;"></p>

五个点击事件：

<button type="button" id="today" class="btn-link" onclick="todayDate()">今日</button>
<button type="button" id="yesterday" class="btn-link" onclick="yesterdayDate()">昨日</button>
<button type="button" id="sevenDay" class="btn-link" onclick="sevenDate()">近7日</button>
<button type="button" id="january" class="btn-link" onclick="JanuaryDate()">近1月</button>
<button type="button" id="oneYear" class="btn-link" onclick="oneYearDate()">近1年</button>

请问这是什么问题

Answer 1

找到原因了：多张echart放在同一个ID的方法，我写错了，原来是这样放的：

lineChartToday = echarts.init(document.getElementById("itemEchart"), "macarons");
lineChartYesterday = echarts.init(document.getElementById("itemEchart"), "macarons");
lineChartSevenday = echarts.init(document.getElementById("itemEchart"), "macarons");
lineChartJanuary = echarts.init(document.getElementById("itemEchart"), "macarons");
lineChartOneYear = echarts.init(document.getElementById("itemEchart"), "macarons");

在调用方法这里，我原来是这样写的：

function fetYesterdayData(data, dataType){
    var param = {
        'dateType': '1'
    };
    jiajajaxFull(requestUrl, param, 'get', function(data){
        if(data && data.length > 0){
         //加粗的这里，原来是lineChartYesterday，以此类推，把上面初始化echarts的变量，依次setOption
            **lineChartToday**.setOption(lineReportOption('昨日活跃时段聊天数',data));
        }else{
            emptyp.show();
        }
    },function(error){
        
    },null);
}

因为是只放同一个ID，所以只要把所有的 .setOption() 星号都换成lineChartToday，就好了