<head>
  <!-- Plotly.js -->
  <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>

<body>
  
  <div id="myDiv" style="width: 480px; height: 300px;"><!-- Plotly chart will be drawn inside this DIV --></div>
  <script>
    <!-- JAVASCRIPT CODE GOES HERE -->
  </script>
</body>
var trace1 = {
  x: [1, 2, 3, 4],
  y: [0, 2, 3, 5],
  type: 'scatter'
};
var trace2 = {
  x: [1, 2, 3, 4],
  y: [3, 5, 1, 7],
  fill: 'tonexty',
  fillcolor: ['rgba(0,255,0,.5)','rgba(255,0,0,.5)'],
  type: 'scatter'
};
var data = [trace1, trace2];

Plotly.newPlot('myDiv', data);
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.