php - 입력 값을 막대 차트에 전달하는 방법

3 개의 입력 필드와 제출 버튼이 있는데 제출 버튼을 누를 때 입력 값에 따라 막대 차트를 표시하고 싶습니다

경고에 대한 가치를 시험 해보니받을 수 있습니다

html이 있습니다

 <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
              <div class="form-group">
                <label for="exampleInputEmail1">Enter Value</label>
                <input type="text" class="form-control" id="value1" name="value1" placeholder="Enter value">
              </div>
              <div class="form-group">
                <label for="exampleInputPassword1">Enter Value</label>
                <input type="text" class="form-control" id="value2" name="value2" placeholder="Enter value">
              </div>
              <div class="form-group">
                <label for="exampleInputPassword1">Enter Value</label>
                <input type="text" class="form-control" id="value3" name="value3" placeholder="Enter value">
              </div>
              <button type="submit" class="btn btn-primary" onclick="getVal()">Submit</button>
            </form>

여기 자바 스크립트가 있습니다

var ctx = document.getElementById('myChart').getContext('2d');
      function getVal()
      {
        var val1 = document.getElementById('value1').value;
        var val2 = document.getElementById('value2').value;
        var val3 = document.getElementById('value3').value;
      }
      var chart = new Chart(ctx, {
          // The type of chart we want to create
          type: 'bar',
          // The data for our dataset
          data: {
              labels: ['value1', 'value2', 'value3'],
              datasets: [{
                  label: 'My First dataset',
                  backgroundColor: 'rgb(255, 99, 132)',
                  borderColor: 'rgb(255, 99, 132)',
                  data: [0, 10, 2, 20, 30, 45] <------ How can i pass val1,val2,val3 here data:[] is an object type
              }]
          },
      });

오류는 없지만 결과는 없습니다. 데이터에 val1, val2, va3을 전달하고 싶습니다 : [0,10,2,20]