An Example of a Google Bar Chart

by magneto903

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: ['corechart', 'line']});
google.charts.setOnLoadCallback(drawBackgroundColor);

var arrAvg = arr => arr.reduce((a,b) => a + b, 0) / arr.length

var func = function(x) {
      return Math.sin(x);
    }
    
    var data_xy = []

    var x = [];
    var y = [];
	
  	var val = 100000
  
    for (var i=0; i < 100; i++) {
      var s_time = performance.now()
      
      for (var j=0; j < val; j++) {
        func(Math.random())
      }
      
      var dur = (performance.now()-s_time)
      data_xy.push([i+1, dur])
      //x.push(i+1)
      //y.push(dur)
    }

function drawBackgroundColor() {
      var data = new google.visualization.DataTable();
      data.addColumn('number', 'X');
      data.addColumn('number', 'Dogs');

      data.addRows(data_xy);

      var options = {
        hAxis: {
          title: 'Time'
        },
        vAxis: {
          title: 'Popularity'
        },
        backgroundColor: '#f1f8e9'
      };

      var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    }
    
    var filtered = []
    var min_x = 10000
    
    for (var i=0; i < data_xy.length; i++) {
    	if (data_xy[i][1] < min_x) {
      	min_x = data_xy[i][1]
      }
    }
    //console.log(data_xy)
    //console.log(min_x)
    for (var i=0; i < data_xy.length; i++) {
    	if (data_xy[i][1] < min_x*5) {
      	filtered.push(data_xy[i][1])
      }
    }
    
    //console.log(filtered)
    
    console.log(arrAvg(filtered)/val*1000000)