JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://cdn.jsdelivr.net/chartist.js/latest/chartist.min.css">
	<script src="http://cdn.jsdelivr.net/chartist.js/latest/chartist.min.js"></script>
	  <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    
    <body>
	<input type="text" id="enter1" placeholder="Значение выборки">
	<input type="text" id="enter2" placeholder="Процент">
	<input type="button" id="button" value="Построить">
	<br> <br> <br>
  <div class="chart1"> </div>
	<div class="chart2"> </div>
	<div id="chart3"> </div>
	



</body>

CSS

table {
		width: 100%;
		border-collapse: collapse;
		border: 1px solid grey;
	}

	tr {
		border: 1px solid grey;
	}

	td {border: 1px solid grey;}

JavaScript

var u1 = [];
		var u2 = [];
		var a = [];
		var n = []; 
		var x = [];
		var xn = [];
		var j = 0 ;
		var l = 0 ;

		function getRandomArbitrary(min, max) {
			return Math.random()*(max-min)+min;
		}


		function job() {

			for (var i = 0; i<Number(document.getElementById("enter1").value); i++)
			{
				var s = Number(document.getElementById("enter1").value);
				l = s;
				var k = Number(document.getElementById("enter2").value)/100;
				u1[i] = getRandomArbitrary(0, 3);
				u2[i] = getRandomArbitrary(0, 3);
				a[i] = getRandomArbitrary(-1, 1);
				x[i] = Math.sin(u1[i])+Math.cos(u2[i]);
				n[i] = x[i]*k*a[i];
				xn[i] = x[i] + n[i];

			}

			var table = document.createElement("table");
			for (var y = 0; y <= s; y++) {
				var tr = table.insertRow(y);
				
				if (y == 0) {
					tr.insertCell(0).innerHTML = "u1";
					tr.insertCell(1).innerHTML = "u2";
					tr.insertCell(2).innerHTML = "xn";
					tr.insertCell(3).innerHTML = "x";

				}
				else {
					for (var i = 0; i < s; i++) {


						tr.insertCell(0).innerHTML = u1[j];
						tr.insertCell(1).innerHTML = u2[j];
						tr.insertCell(2).innerHTML = xn[j];
						tr.insertCell(3).innerHTML = x[j];
						j++;
						break;

					}
				}
				

				


			}

			
			document.body.appendChild(table);





google.charts.load('current', {packages: ['corechart', 'line']});
google.charts.setOnLoadCallback(drawBackgroundColor);

function drawBackgroundColor() {
      var data = new google.visualization.DataTable();
      data.addColumn('number', 'X');
      data.addColumn('number', 'Dogs');
				var sortArray = [];
				for (var i = 0; i<l; i++)
        {
          sortArray.push({ u1:u1[i], x: x[i] });
        }
				
        function compare(a,b) {
        if (a.u1 < b.u1)
          return -1;
        if (a.u1 > b.u1)
          return 1;
        return 0;
      }

      sortArray.sort(compare);
        
        
      	for (var i = 0; i<l; i++)
      	{
      	data.addRows([
      		[sortArray[i].u1, sortArray[i].x]
   ...