Black Lives Matter. Please consider donating to Black Girls Code today.
Learn how to use COVID-19 data in open source Dash apps. Register for the Sept 23rd webinar with IQT!

Why plotly area graph is not displaying data properly?

Data is coming from beck end correctly but on graph is not displaying properly sometimes. Why?
I referred this code.
Area of graph not filling properly. My graph is looking like this some time:

Here is my code:

<body>  
 <div id="myDiv" style="width: 480px; height: 400px;"><!-- Plotly chart will be drawn inside this DIV --></div>
 <script>
var abc = ['2013-10-04 02:23:00', '2013-10-22 12:23:00',  '2013-11-04 20:23:00', '2013-11-020 10:23:00','2013-12-04 15:10:45', '2013-12-26 06:03:00'];
abc[6]='2014-05-02 20:23:00';
var trace1 = {
x: abc,
y: [1, 3, 6,9, 4, 5,8],
  fill: 'tozeroy',
  fillcolor: 'red',
  text: server1,
  hoverinfo: "x+y+text",
  name:"Server 1",
  type: 'scatter',
  mode:"markers",
  marker:
  {
	size:4,
	color:"gray"
  },
  uid:"c2e171",
  dragmode:"turntable"
};
var layout = {
  margin: {
	l: 35,
	r: 40,
	b: 50,
	t: 10
  },
  legend: {
	"orientation": "h"
  },
  xaxis: {
	showgrid: false,
	showline: true,
	ticks: "outside"
  },
  yaxis : {
	fixedrange: true,
	showgrid: false,
	showline: true,
	ticks: "outside"
  },
  dragmode:false,
};
var data = [trace1];
Plotly.newPlot('myDiv', data,layout, {modeBarButtonsToRemove: ['sendDataToCloud','hoverCompareCartesian','zoom2d','pan2d','select2d','lasso2d','autoScale2d','hoverClosestCartesian','toggleSpikelines']});

var plotDiv = document.getElementById('myDiv');
plotDiv.on('plotly_relayout',
function(eventdata){  
    alert( 'ZOOM!' + '\n\n' +
        'Event data:' + '\n' + 
         JSON.stringify(eventdata) + '\n\n' +
        'x-axis start:' + new Date(eventdata['xaxis.range[0]'])+ '\n' +
        'x-axis end:' + new Date(eventdata['xaxis.range[1]']));
		var xVal = new Date(eventdata['xaxis.range[0]']);
		var yVal = new Date(eventdata['xaxis.range[1]']);
});

</script>
</body>

Can you a code snippet of the graph you took a screenshot of to help us debug?

I Updated my code. Please help me

I can’t replicate in https://codepen.io/etpinard/pen/WjrEpE

Can you help me out?

Thank you for your response. Please don’t consider above x and y value. I kept here to understand code. I’m getting value for x and value from backend service. Some times graph is displaying like above, but I checked data is correct only.