如何动态添加多个 Y 轴到 plotly.js 绘图

Question

我有几个复选框，选择它们应该会向现有折线图添加跟踪。我想要多个 y 轴，因为它们的值差别很大。

我从 AJAX 调用中读取新值，每隔一秒更新一次图表。并创建一个 dict 来存储应该绘制的痕迹。

这是我所做的：

var interval = setInterval(function() {
    $.ajax({
        url : 'ajax/updatevalues',
        dataType : 'json',
        type : 'GET',
        success: function(data)
        {
            var dateStr = JSON.parse(data.temperature.last_timestamp);
            temp_time = new Date(dateStr);
            temp_temperature = data.temperature.last;
            temp_d850 = data.d850.last;
            temp_d280 = data.d280.last;

            index.push(temp_time);
            temperature.push(data.temperature.last);
            d850.push(data.d850.last);
            d280.push(data.d280.last);
        }
    });
    temperature_list = [];
    d850_list = [];
    d280_list = [];

    $('input[type=checkbox]').each(function () {

        num = get_number_of_traces();
        new_y = num[num.length-1];

        if(this.checked == true){
            if(this.name == 'Temperature'){
                temperature_filtered = get_filtered_data(temperature);
                trace_temperature = draw_trace_data(new_y, get_filtered_index(), temperature_filtered, "Temperature [°C]" );  
                dict_traces[document.getElementById('temperature').name] = trace_temperature;
            }else if(this.name == 'D850'){
                d850_filtered = get_filtered_data(d850);
                trace_d850  = draw_trace_data(new_y, get_filtered_index(), d850_filtered, "D850" );
                dict_traces[document.getElementById('d850').name] = trace_d850;
            }else if(this.name == 'D280'){
                d280_filtered = get_filtered_data(d280);
                trace_d280  = draw_trace_data(new_y, get_filtered_index(), d280_filtered, "D280" ); 
                dict_traces[document.getElementById('d280').name] = trace_d280;
            }
        }

        values = Object.keys(dict_traces).map(function(key){
            return dict_traces[key];
        });
        
    });
    Plotly.newPlot(testGraph, values);
    cnt++;

    var i=0;


    // updating the graphs layout for each trace
    Object.keys(dict_traces).forEach(function(key) {
        Plotly.relayout(testGraph,
                            {
                            ["yaxis" + i]: {
                                title: "y" + i,
                                overlaying: "y1",
                                side: "left",
                                position: 0.1 * (i)
                            },
                            xaxis: {
                                domain : [0.1 * (i ), 1]
                            }
                            }
        );
        i++;
    });
if(++cnt === 100) clearInterval(interval);
}, 1000);

当我点击新的复选框时。图形变小，这意味着 xaxis 属性正在影响绘图，但没有新的 y 轴添加到绘图中。

我做错了什么？