JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>

  <div id="chartContainer" style="height: 300px; width: 100%;">
  </div>

JavaScript

window.onload = function () {
  var chart = new CanvasJS.Chart("chartContainer",
                                 {
    title: {
      text: "Monthly Downloads"
    },
    data: [
      {
        type: "line",
        dataPoints: [

          { y: 2600 },
          { y: 3800 },
          { y: 4300 },
          { y: 2900 },
          { y: 4100 },
          { y: 4500 },
          { y: 8600 },
          { y: 6400 },
          { y: 5300 },
          { y: 6000 },
          { y: 5000 },
          { y: 6800 }
        ]
      }
    ]
  });
  chart.render();

  var screenWidth = jQuery(window).width();
  var dpsCount = 6;            //no. of datapoints to be displayed on phone
  var dps = [];

  if(screenWidth <= 768 ) {
    for(var i = 0; i < dpsCount; i++) {
      dps.push(chart.options.data[0].dataPoints[i]);
    }
    chart.options.data[0].dataPoints = dps;
    chart.render();
  } 
}