JSFiddle - React, Tailwind, and code Playground

HTML

<p>Please input a number between 0.1 and 1:</p>

<input id="numb">

<button type="button" onclick="myFunction()">Submit</button>

<p id="demo"></p>

<canvas width="300" height="300" id="my_Canvas"></canvas>

JavaScript

function myFunction() {
  var a, text;

  // Get the value of the input field with id="numb"
  a = document.getElementById("numb").value;
  alterCanvas(a); //Call function that alters the canvas
}

function alterCanvas(a) { //Create a function to setup and alter the canvas
  /* Step1: Prepare the canvas and get WebGL context */
  var canvas = document.getElementById('my_Canvas');
  var gl = canvas.getContext('experimental-webgl');
  /* Step2: Define the geometry and store it in buffer objects */
  var vertices = new Array();
  //myFunction does not work, so i have to initialize a in here 

  if (typeof a == "undefined") a = 0.3;
  var x;
  var y;
  var tmp;
  tmp = 0;
  x = 0;
  y = 0;

  for (t = 0; t < 360; t += 0.01) {
    //these are for cart
    x = a * (2 * Math.cos(t) - Math.cos(2 * t));
    y = a * (2 * Math.sin(t) - Math.sin(2 * t));

    vertices.push(x);
    //these are for other funct
    //x = a*Math.pow(Math.cos(t),3);
    //y = a*Math.pow(Math.sin(t),3);
    vertices.push(y);
    tmp++;

  }

  // Create a new buffer object
  var vertex_buffer = gl.createBuffer();
  // Bind an empty array buffer to it
  gl.bindBuffer(gl.ARRAY_BUFFER, vertex_buffer);
  // Pass the vertices data to the buffer
  gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
  // Unbind the buffer
  gl.bindBuffer(gl.ARRAY_BUFFER, null);

  /* Step3: Create and compile Shader programs */
  // Vertex shader source code
  var vertCode = 'attribute vec2 coordinates;' + 'void main(void) {' + '             gl_Position = vec4(coordinates,0.0, 1.0);' + '}';

  //Create a vertex shader object
  var vertShader = gl.createShader(gl.VERTEX_SHADER);
  //Attach vertex shader source code
  gl.shaderSource(vertShader, vertCode);
  //Compile the vertex shader
  gl.compileShader(vertShader);
  //Fragment shader source code
  var fragCode = 'void main(void) {' + 'gl_FragColor = vec4(0.0, 0.0,         0.0,0.1);' + '}';
  // Create fragment shader object
  var fragShader =...