Plotly: как отобразить столбчатую диаграмму поверх точечной диаграммы?

#javascript #plotly

#javascript #plotly

Вопрос:

Я использую plotly.js чтобы выполнить некоторую визуализацию данных. Мне нужно отобразить точечную диаграмму с непрозрачной заполненной областью за столбчатой диаграммой — что-то вроде этого — но независимо от того, сколько я играю с непрозрачностью столбчатой диаграммы или порядком расположения моего массива данных, график с заполненной областью размещается поверх столбчатой диаграммы.

Вот как выглядит мой код:

 <script> 
var trace2 = {
  x: [1, 2, 3, 4, 5], 
  y: [120, 180, 290, 150, 110], 
  name: 'Type 1', 
  type: 'bar'
};

var trace5 = {
  x: [1, 2, 3, 4, 5], 
  y: [75, 48, 38, 61, 52],
  name: 'Type 2', 
  fill: 'tozeroy',
  fillcolor: 'rgb(235, 185, 10)',
  type: 'scatter',
  mode: 'none'
};

var data1 = [trace5, trace2];
var layout = {
  xaxis: {
    showdividers: true,
    dividercolor: 'grey',
    dividerwidth: 2
  },
  yaxis: {title: '<b>Data</b>', side: 'right'}
};

Plotly.newPlot('myDiv', data1, layout);
</script>