setInterval not working with file_get_contents

Question

Hi I'm pretty new with javascript and I encountered an issue with setInterval function's and speedgauge here is my code

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/modules/solid-gauge.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>
<script src="https://code.highcharts.com/modules/accessibility.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<figure class="highcharts-figure">
  <div id="container-speed" class="chart-container"></div>
  <p class="highcharts-description">
  </p>
</figure>

<script>  
var gaugeOptions = {
    chart: {
        type: 'solidgauge',
        backgroundColor: '#000000',
    },

    title: null,

    pane: {
        center: ['50%', '85%'],
        size: '140%',
        startAngle: -100,
        endAngle: 100,
        background: {
            backgroundColor:
                Highcharts.defaultOptions.legend.backgroundColor || '#FFFFFF',
            innerRadius: '60%',
            outerRadius: '100%',
            shape: 'arc'
        }
    },

    exporting: {
        enabled: false
    },

    tooltip: {
        enabled: false
    },

    // the value axis
    yAxis: {
        stops: [
            [0.5, '#55BF3B'], // green
            [0.7, '#DDDF0D'], // yellow
            [0.9, '#DF5353'] // red
        ],
        lineWidth: 0,
        tickWidth: 0,
        minorTickInterval: null,
        tickAmount: 2,
        title: {
            y: -70
        },
        labels: {
            y: 16
        }
    },

    plotOptions: {
        solidgauge: {
            dataLabels: {
                y: 5,
                borderWidth: 0,
                useHTML: true
            }
        }
    }
};

// The speed gauge
var chartSpeed = Highcharts.chart('container-speed', Highcharts.merge(gaugeOptions, {
    yAxis: {
        min: 0,
        max: 100,
        title: {
            text: 'Température'
        }
    },

    credits: {
        enabled: false
    },

    series: [{
        name: 'Température',
        data: [40],
        dataLabels: {
            format:
                '<div style="text-align:center">' +
                '<span style="font-size:25px; color:#FFFFFF">{y}</span><br/>' +
                '<span style="font-size:12px;opacity:0.4; color:#FFFFFF">°C</span>' +
                '</div>'
        },
        tooltip: {
            valueSuffix: ' °C'
        }
    }]

}));
var newVal = 0;
setInterval(tempCpudata, 500, <?=file_get_contents("../../../sys/class/thermal/thermal_zone0/temp");?>);

function tempCpudata(arg) {
    var p;

    if (chartSpeed) {
        p = chartSpeed.series[0].points[0];
        var inc = 1;
        var newVal = newVal + inc;
        p.update(arg);
        console.log(arg);
        console.log(newVal);
        
    }

}



</script>

what I'm trying to do is an admin page in php where I could see the server's temperature, disk space, ... But despite the function is using previous value from newVal the file_get_contents stills read the same value (even it's changing in the document) PS: I have access to the server, it's on a raspberry pi. Thanks