Вот код
var trace1 = {
x: [1, 2, 3],
y: [40, 50, 60],
name: 'yaxis data',
type: 'scatter'
};
var trace2 = {
x: [2, 3, 4],
y: [4, 5, 6],
name: 'yaxis2 data',
yaxis: 'y2',
type: 'scatter'
};
var data = [trace1, trace2];
var layout = {
title: 'Double Y Axis Example',
yaxis: {title: 'yaxis title'},
yaxis2: {
title: 'yaxis2 title',
titlefont: {color: 'rgb(148, 103, 189)'},
tickfont: {color: 'rgb(148, 103, 189)'},
overlaying: 'y',
side: 'right'
}
};
Plotly.newPlot('myDiv', data, layout);
Я пробовал это, и он работает хорошо, как показано в примере.
Но есть одна проблема. У меня есть несколько графиков, и, возможно, потребуется построить их по двум осям, а иногда и по трем или более. Это будет зависеть от ситуации и полученных данных. Поэтому я попытался изменить приведенный выше сценарий, чтобы он давал мне динамический способ построения данных по осям.
Я сделал что-то вроде этого:
var trace1 = {
x: [1, 2, 3],
y: [40, 50, 60],
name: 'yaxis data',
type: 'scatter'
};
var trace2 = {
x: [2, 3, 4],
y: [4, 5, 6],
name: 'yaxis2 data',
yaxis: 'y2',
type: 'scatter'
};
var data = [trace1, trace2];
var layout = {
title: 'Double Y Axis Example',
yaxis: [{title: 'yaxis title'},{
title: 'yaxis2 title',
titlefont: {color: 'rgb(148, 103, 189)'},
tickfont: {color: 'rgb(148, 103, 189)'},
overlaying: 'y',
side: 'right'
}]
};
Plotly.newPlot('myDiv', data, layout);
Но мне он показывает только один сюжет. Вот изображение:
Не знаю, почему я получаю только один сюжет, а где второй. Легенды показывают два графика.
Пожалуйста, дайте мне знать, как я могу написать правильный запрос для такого типа ситуации.