cannot pass an array to html component

Ask the community
,
1

I tried to pass an array to create a timeline on google chart embedded in a html component. However,I cannot get the same array after passing through window.onmessage = function(event).
I think something is wrong here. The html code works fine if I replaced the test data with data array.

Please help.

$w.onReady( function () {
var data = [ [‘member’,‘john’,8,16], [‘member’,‘jane’,12,16], [‘member’,‘anne’,15,16] ]
$w(‘#html1’).postMessage(data)
});

—on html code—

Google Charts
var newdata = [] var testdata = [] window.onmessage = function(event){ if (event.data && Array.isArray(event.data)) { testdata = event.data; } }; 
  	for(let i = 0;i<testdata.length;i++){ 
     	newdata.push([testdata[i][0],testdata[i][1],new Date(0,0,0,testdata[i][2],0,0),new Date(0,0,0,testdata[i][3],0,0)]) 
        } 

     function drawChart() { 
        // Define the chart to be drawn. 
        var data = new google.visualization.DataTable(); 
        data.addColumn({type:'string',id:'Role'}); 
        data.addColumn({ type: 'string', id: 'Name' }); 
        data.addColumn({ type: 'date', id: 'Start' }); 
        data.addColumn({ type: 'date', id: 'End' }); 
        data.addRows(newdata); 

        var options = {       
           width: '100%',  
           height: '100%' 
        }; 
              
        // Instantiate and draw the chart. 
        var chart = new google.visualization.Timeline(document.getElementById('container')); 
        chart.draw(data, options); 
     } 
     google.charts.setOnLoadCallback(drawChart); 
  </script>