JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
       <div id="chart_div"></div>

JavaScript

google.charts.load('current', {'packages':['bar']});
      google.charts.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
            [ {label: 'Year', id: 'year', type: 'date'},
              {label: 'Sales', id: 'Sales', type: 'number'}, 
              {label: 'Expenses', id: 'Expenses', type: 'number'},
              {label: 'Profit', id: 'Profit', type: 'number'}],
              [{v:new Date('2014'), f:'2014'}, 0, 400, 200],
              [{v:new Date('2014'), f:'2014'}, 1000, 0, 0],
              [{v:new Date('2015'), f:'2015'}, 0, 460, 250],
              [{v:new Date('2015'), f:'2015'}, 1170, 0, 0],
              [{v:new Date('2016'), f:'2016'}, 0, 1120, 300],
              [{v:new Date('2016'), f:'2016'}, 600, 0, 0],
              [{v:new Date('2017'), f:'2017'}, 0, 540, 350],
              [{v:new Date('2017'), f:'2017'}, 1030, 0, 0]
            ]);

        var options = {
              chart: {
                title: 'Company Performance',
                subtitle: 'Sales, Expenses, and Profit: 2014-2017',
              },
              bars: 'horizontal',
              height: 400,
              isStacked: true,      
explorer: { 
        actions: ['dragToZoom', 'rightClickToReset'],
        axis: 'horizontal',
        keepInBounds: true,
        maxZoomIn: 4.0
}
       };

        var chart = new google.charts.Bar(document.getElementById('chart_div'));

        chart.draw(data, google.charts.Bar.convertOptions(options));
        }