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

<body>
  <div id="myDiv"><!-- Plotly chart will be drawn inside this DIV --></div>
  <script>
    <!-- JAVASCRIPT CODE GOES HERE -->
  </script>
</body>
#myDiv {
  margin: 0 auto;
  border: 1px solid black;
  height: 85vh;
  min-height: 300px;
}
const data = [
  {
    "sum" : 712,
    "avg" : 23.7333333333333333,
    "sale_day" : "2019-08-05T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-08-04T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-08-03T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-08-02T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-08-01T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-31T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-30T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-29T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-28T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-27T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-26T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-25T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-24T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-23T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-22T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-21T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-20T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-19T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-18T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-17T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-16T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-15T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-14T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-13T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-12T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-11T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-10T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-09T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-08T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-07T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-06T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-05T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-04T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-03T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-02T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-07-01T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-30T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-29T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-28T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-27T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-26T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-25T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-24T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-23T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-22T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-21T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-20T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-19T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-18T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-17T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-16T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-15T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-14T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-13T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-12T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-11T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-10T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-09T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-08T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-07T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-06T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-05T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-04T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-03T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-02T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-06-01T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-31T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-30T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-29T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-28T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-27T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-26T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-25T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-24T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-23T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-22T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-21T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-20T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-19T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-18T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-17T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-16T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-15T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-14T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-13T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-12T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-11T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-10T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-09T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-08T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-07T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-06T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-05T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-04T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-03T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-02T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-05-01T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-04-30T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-29T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-28T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-27T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-26T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-25T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-24T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-23T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-22T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-21T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-20T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-19T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-18T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-17T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-16T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-15T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-14T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-13T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-12T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-11T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-10T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-09T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-08T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-07T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-06T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-05T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-04T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-03T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-02T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-04-01T00:00:00"
  },
  {
    "sum" : 719,
    "avg" : 23.9666666666666667,
    "sale_day" : "2019-03-31T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-30T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-29T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-28T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-27T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-26T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-25T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-24T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-23T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-22T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-21T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-20T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-19T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-18T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-17T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-16T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-15T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-14T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-13T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-12T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-11T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-10T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-09T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-08T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-07T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-06T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-05T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-04T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-03T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-02T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-03-01T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-28T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-27T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-26T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-25T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-24T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-23T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-22T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-21T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-20T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-19T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-18T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-17T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-16T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-15T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-14T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-13T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-12T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-11T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-10T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-09T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-08T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-07T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-06T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-05T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-04T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-03T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-02T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-02-01T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-31T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-30T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-29T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-28T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-27T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-26T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-25T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-24T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-23T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-22T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-21T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-20T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-19T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-18T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-17T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-16T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-15T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-14T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-13T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-12T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-11T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-10T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-09T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-08T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-07T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-06T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-05T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-04T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-03T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-02T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2019-01-01T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-31T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-30T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-29T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-28T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-27T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-26T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-25T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-24T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-23T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-22T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-21T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-20T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-19T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-18T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-17T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-16T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-15T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-14T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-13T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-12T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-11T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-10T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-09T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-08T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-07T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-06T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-05T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-04T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-03T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-02T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-12-01T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-11-30T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-11-29T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-11-28T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-11-27T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-26T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-25T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-24T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-23T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-22T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-21T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-20T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-19T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-18T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-17T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-16T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-15T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-14T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-13T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-12T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-11T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-10T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-09T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-08T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-07T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-06T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-05T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-04T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-03T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-02T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-11-01T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-10-31T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-10-30T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-10-29T00:00:00"
  },
  {
    "sum" : 721,
    "avg" : 24.0333333333333333,
    "sale_day" : "2018-10-28T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-27T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-26T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-25T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-24T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-23T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-22T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-21T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-20T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-19T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-18T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-17T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-16T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-15T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-14T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-13T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-12T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-11T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-10T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-09T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-08T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-07T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-06T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-05T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-04T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-03T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-02T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-10-01T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-30T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-29T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-28T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-27T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-26T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-25T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-24T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-23T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-22T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-21T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-20T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-19T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-18T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-17T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-16T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-15T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-14T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-13T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-12T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-11T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-10T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-09T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-08T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-07T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-06T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-05T00:00:00"
  },
  {
    "sum" : 720,
    "avg" : 24,
    "sale_day" : "2018-09-04T00:00:00"
  },
  {
    "sum" : 705,
    "avg" : 23.5,
    "sale_day" : "2018-09-03T00:00:00"
  },
  {
    "sum" : 681,
    "avg" : 23.4827586206896552,
    "sale_day" : "2018-09-02T00:00:00"
  },
  {
    "sum" : 657,
    "avg" : 23.4642857142857143,
    "sale_day" : "2018-09-01T00:00:00"
  },
  {
    "sum" : 633,
    "avg" : 23.4444444444444444,
    "sale_day" : "2018-08-31T00:00:00"
  },
  {
    "sum" : 609,
    "avg" : 23.4230769230769231,
    "sale_day" : "2018-08-30T00:00:00"
  },
  {
    "sum" : 585,
    "avg" : 23.4,
    "sale_day" : "2018-08-29T00:00:00"
  },
  {
    "sum" : 561,
    "avg" : 23.375,
    "sale_day" : "2018-08-28T00:00:00"
  },
  {
    "sum" : 537,
    "avg" : 23.3478260869565217,
    "sale_day" : "2018-08-27T00:00:00"
  },
  {
    "sum" : 513,
    "avg" : 23.3181818181818182,
    "sale_day" : "2018-08-26T00:00:00"
  },
  {
    "sum" : 489,
    "avg" : 23.2857142857142857,
    "sale_day" : "2018-08-25T00:00:00"
  },
  {
    "sum" : 465,
    "avg" : 23.25,
    "sale_day" : "2018-08-24T00:00:00"
  },
  {
    "sum" : 441,
    "avg" : 23.2105263157894737,
    "sale_day" : "2018-08-23T00:00:00"
  },
  {
    "sum" : 417,
    "avg" : 23.1666666666666667,
    "sale_day" : "2018-08-22T00:00:00"
  },
  {
    "sum" : 393,
    "avg" : 23.1176470588235294,
    "sale_day" : "2018-08-21T00:00:00"
  },
  {
    "sum" : 369,
    "avg" : 23.0625,
    "sale_day" : "2018-08-20T00:00:00"
  },
  {
    "sum" : 345,
    "avg" : 23,
    "sale_day" : "2018-08-19T00:00:00"
  },
  {
    "sum" : 321,
    "avg" : 22.9285714285714286,
    "sale_day" : "2018-08-18T00:00:00"
  },
  {
    "sum" : 297,
    "avg" : 22.8461538461538462,
    "sale_day" : "2018-08-17T00:00:00"
  },
  {
    "sum" : 273,
    "avg" : 22.75,
    "sale_day" : "2018-08-16T00:00:00"
  },
  {
    "sum" : 249,
    "avg" : 22.6363636363636364,
    "sale_day" : "2018-08-15T00:00:00"
  },
  {
    "sum" : 225,
    "avg" : 22.5,
    "sale_day" : "2018-08-14T00:00:00"
  },
  {
    "sum" : 201,
    "avg" : 22.3333333333333333,
    "sale_day" : "2018-08-13T00:00:00"
  },
  {
    "sum" : 177,
    "avg" : 22.125,
    "sale_day" : "2018-08-12T00:00:00"
  },
  {
    "sum" : 153,
    "avg" : 21.8571428571428571,
    "sale_day" : "2018-08-11T00:00:00"
  },
  {
    "sum" : 129,
    "avg" : 21.5,
    "sale_day" : "2018-08-10T00:00:00"
  },
  {
    "sum" : 105,
    "avg" : 21,
    "sale_day" : "2018-08-09T00:00:00"
  },
  {
    "sum" : 81,
    "avg" : 20.25,
    "sale_day" : "2018-08-08T00:00:00"
  },
  {
    "sum" : 57,
    "avg" : 19,
    "sale_day" : "2018-08-07T00:00:00"
  },
  {
    "sum" : 33,
    "avg" : 16.5,
    "sale_day" : "2018-08-06T00:00:00"
  },
  {
    "sum" : 9,
    "avg" : 9,
    "sale_day" : "2018-08-05T00:00:00"
  }
]

const trace1 = {
    type: "scatter",
    mode: "lines",
    x: data.map(d => new Date(d.sale_day)),
    y: data.map(d => d.sum),
    marker: {
        color: '#C8A2C8',
        line: {
            width: 1
        }
    }
};

const vis_data = [ trace1 ];

const layout = { 
  title: '30 Day Moving Average of Sales',
  font: {size: 18}
};

Plotly.newPlot('myDiv', vis_data, layout, {responsive: true});
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.