JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.js"></script>
<div id="p1" class="chart">
    <canvas id='c1'></canvas>
</div>

JavaScript

var c1 = document.getElementById("c1");
var parent = document.getElementById("p1");
c1.width = parent.offsetWidth - 40;
c1.height = parent.offsetHeight - 40;

var data1 = {
  labels : ["SUN","MON","TUE","WED","THU","FRI","SAT"],
  datasets : [
    {
      fillColor : "rgba(255,255,255,.1)",
      strokeColor : "rgba(0,0,0,.25)",

      pointColor : "#0af",
      pointStrokeColor : "rgba(255,255,255,1)",
      pointHighlightFill : "#fff",
      pointHighlightStroke : "rgba(220,220,220,1)",
      data : [150,200,235,390,290,250,250]
    }
  ]
}

var options1 = {
  scaleFontColor : "rgba(0,0,0,1)",
  scaleLineColor : "rgba(0,0,0,.1)",
  scaleGridLineColor : "rgba(0,0,0,.1)",
  scaleShowGridLines : true,
  scaleShowLabels : false,
  scaleShowHorizontalLines : false,
  bezierCurve : false,
  scaleOverride : true,
  scaleSteps : 5,
  scaleStepWidth : 100,
    tooltipTemplate: "<%= value %>" + " Guests",
    // String - Template string for multiple tooltips
    multiTooltipTemplate: "<%= value %>",
        
        showTooltips: true,
        tooltipFillColor: "#0af",
    showTooltip: function(data, val){
            console.log(data);
    },
        
        onAnimationComplete: function()
        {    var tempArr = [];
         this.datasets[0].points.forEach(function(point){
             if(point.value >= 390){
                 tempArr.push(point);
             }
         });
            this.showTooltip(tempArr, true);          
        },
        tooltipEvents: []

}

new Chart(c1.getContext("2d")).Line(data1,options1);