Chart js does not display when a variable is used as part of the array

the script below displays a chart using chart js.

<script>
var xValues = ["Italy", "France", "Spain", "USA", "Argentina"];

    var yValues = [55, 49, 44, 24, 15];

var barColors = ["red", "green","blue","orange","brown"];

new Chart("myChart", {
  type: "bar",
  data: {
    labels: xValues,
    datasets: [{
      backgroundColor: barColors,
      data: yValues
    }]
  },
  options: {
    legend: {display: false},
    title: {
      display: true,
      text: "World Wine Production 2018"
    }
  }
});
</script>

But I need to replace the numbers with variables that have already been assigned numbers in the document. The chart disappears when I do this as shown below

I replaced this above

var yValues = [55, 49, 44, 24, 15];

with this

var yValues = [$tto_app, $a_rel, $monthly_exp, $cumm_exp];

Please how can I fix this?