Как построить два участка на том же рисунке в plotly.js

Question

Я хочу построить 2 участка на том же рисунке, используя plotly.js. Я просмотрел документацию plotly.js, но не смог ее найти. Может ли любой орган помочь?

Вот фрагмент кода:

Первый участок:

var data4 = [ { 
     z: z, 
     x: x, 
     y: y, 
     type: 'contour' 
    } 
]; 

var layout = { 
    title: 'Simple Contour Plot' 
} 

Plotly.newPlot('visualization2', data4, layout); 

Второй участок:

var trace = { 
    x: x11, 
    y: x21, 
    mode: 'lines+markers' 
}; 

var data3 = [ trace]; 

var layout = { 
    title:'Line and Scatter Plot', 
    height: 400, 
    width: 480 
}; 

Plotly.newPlot('visualization3', data3, layout); 

Я хочу, чтобы построить эти два в один рисунок. Примечание. Первый - контурный график, а второй - график линии.

Answer 1

У вас есть возможность поместить несколько следов в свои данные, которые вы хотите построить, и они будут строить их.

У вас также может быть только 1 заголовок на граф, однако вы можете иметь несколько названий осей.

var firstPlotTrace = { 
    z: z, 
    x: x, 
    y: y, 
    type: 'contour' 
    name: 'yaxis data' 
}; 

var secondPlotTrace = { 
    x: x11, 
    y: x21, 
    mode: 'lines+markers' 
    name: 'yaxis2 data' 
}; 

var plotData = [firstPlotTrace, secondPlotTrace]; 

var layout = { 
    title: 'Double Plot Title', 
    height: 400, 
    width: 400, 
    yaxis: {title: 'Simple Contour Plot Axis', range: [-20, 20]} 
    yaxis2: {title: 'Line and Scatter Plot Axis', range: [-20, 20]} 
}; 

Plotly.newPlot('plotDiv', plotData, layout); 

HTML -

<div id="plotDiv" style="height: 400px; width: 400px;"></div>