Showing Plotlyjs bar and scatter charts in the same diagram

plotly.js
1

I need to show Bar and Scatter charts in the same diagram using Plotly.js

I have the following code, when you include width: [.03, .03, .03] for the bar chart, it does NOT show the bar chart, BUT if you remove it, it will display the bar chart.

I actually need to have width for the Bar chart!

How can I add width for the Bar chart?

CodePen Example

var trace1 = {
  x: ['2019-11-11T13:15:00', 
      '2019-11-12T13:30:00',
      '2019-11-13T13:45:00'], 
  y: [20, 14, 23],
  type: 'scatter',
   xaxis1: 'x',
   yaxis1: 'y',
   type: 'scatter',
   hoverinfo: 'y'
};

var trace2 = {
  x: ['2019-11-11T13:15:00', 
      '2019-11-12T13:30:00',
      '2019-11-13T13:45:00'], 
  y: [20, 14, 23],
  width: [.03, .03, .03],
  name: 'SF Zoo', 
  type: 'bar'
};

var data = [trace1, trace2];


Plotly.newPlot('myDiv', data);
2

Hi @soheils, welcome to the forum! It’s because bar widths have to be given in axis units, here in ms. Try to replace 0.03 with .03 * 1000 * 60 * 60 * 24. (The issue was also raised on https://github.com/plotly/plotly.js/issues/2559, the documentation could me more explicit about this…).