Graphic Passing php data to js

Hello,

I have a file in php with a div calling the js file, but I need the js file to read the php data

no archived php:

    <div id="chart_div" style="width: 100%; height: 500px;"></div>

in the js file:

    function mainChart(){

  var color1 = App.color.primary;
  var color2 = tinycolor( App.color.primary ).lighten( 13 ).toString();
  var color3 = tinycolor( App.color.primary ).lighten( 20 ).toString();

  var data = [
    [1, 35],
    [2, 60],
    [3, 40],
    [4, 65],
    [5, 45],
    [6, 75],
    [7, 35],
    [8, 40],
    [9, 60]
  ];

Instead of this fixed array I have to get this data in the Bank it would look like this:

function mainChart(){

    var color1 = App.color.primary;
    var color2 = tinycolor( App.color.primary ).lighten( 13 ).toString();
    var color3 = tinycolor( App.color.primary ).lighten( 20 ).toString();

    var data = [
        <?php
        $i = '0';
        foreach ($ConsultasCanceladas as $canceladas) {
            $i = ++$i;
            echo "['" . $i . "', " . $canceladas->dt_consulta . "],";
        }
        ?>
    ];

What happens is that the file js does not accept php