Laravel Livewire and Google Charts

I am using Laravel livewire for a web application and am using google charts along with it. Inside my application, I have a tab for showing data which I display using google charts. I made this data component a livewire component. The user interacting with the page will select a week that they want to view and the app will return the data associated with that week and display in on the livewire.blade.php component. Here is my simple HTML code for the livewire blade component.

<label for="week">Select a week:</label>
  <input type="week" wire:model='week'>
 <input class='btn btn-info' type="button" wire:click="changeWeek()" value='changeWeek' id='changeweek'>

      <!--  <div class="m-5">
        <div id="barchart" class='data'></div>
        </div>-->
        <div class="m-5">
    <div id="table_div" class='data'></div>
        </div>
        <div class="m-5">
    <div id="curve_chart" class='data'></div>
        </div>
        <div class="m-5">
    <div id="piechart_3d" class='data'></div>
        </div>

Here the week the user wants to view is saved as a $week variable and when the button is clicked, the function changeWeek() from the livewire controller is called. Here is the code for the livewire controller.

class LiveData extends Component
{

    public $week;
    public $y;
    public $arr;


    public function changeWeek(){

        $this->y = [];
        $this->arr=[];

        function hours_tofloat($val){
            if (empty($val)) {
                return 0;
            }
            $parts = explode(':', $val);
            return $parts[0] + floor(($parts[1]/60)*100) / 100;
        }
       // $this->week = $weekVal;

       $this->week = date("Y-m-d",strtotime($this->week));

       $date1 = $this->week . " 07:00:00";

       $date2 = date('Y-m-d',strtotime("+6 day", strtotime($this->week))) . " 07:00:00";
/************************************************************************
HERE 2 stored procedures are called to fill up the $y and $arr variables
***********************************************************************/



    $this->y = json_encode($this->y);
    $this->arr = json_encode($this->arr);
       


    }

    public function render()
    {

        return view('livewire.live-data');

    }
    
}

So, simply two arrays are returned that follow this pattern:

[["2021,04,26",20,"00:15:37"],["2021,04,27",338,"08:45:28"],["2021,04,28",172,"04:17:24"],["2021,05,01",22,"01:29:35"]]

When these arrays are returned, I need to store these in javascript variables in order for google charts to be able to display the data. Here is my JS code:

 function tableChart(data1){

        for (var i=0;i<data1.length;i++){
           data1[i][0] = new Date(data1[i][0].split`,`.map(x=>+x));
        }

       var data = new google.visualization.DataTable();
        data.addColumn('date', 'Date');
        data.addColumn('number', 'Total Count');
        data.addColumn('string','Uptime');

        data.addRows(data1);

        var options = {
            //showRowNumber:true,
            width:'100%',
            height:'100%',
            cssClassNames:{
                headerRow:'tableChartHeader',
            },
            alternatingRowStyle:true,
        };
        var table = new google.visualization.Table(document.getElementById('table_div'));
        table.draw(data,options);

       }


/********************************************************************************
function to call when data from livewire is returned
*******************************************************************************/
function makeChart(){
        var test='<?php echo $y;?>';
        console.log(test);
    }

The problem is that when the javascript originally runs, these php variables are empty arrays, however when the user clicks on the change week button, the php variables change but not the javascript variable 'test'. This variable stays as null. Any ideas on how I can fix this? Any help is greatly appreciated.

source https://stackoverflow.com/questions/67827159/laravel-livewire-and-google-charts