Googleスプレッドシートにjsonデータを挿入中にエラーが発生しました

Question

GoogleスプレッドシートにJSONデータを挿入しようとしています。このコードを実行していますがこれは

TypeError: google.visualization is undefined

どのように私はそのエラーを解決することができるようにエラーを取得しています、

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> 

<script> 
var read=(function(){ 

data1={ 
     "jobstatus": [ 
         { 
          "dateAndTime": "hi", 
          "jobId": "TCC_tfc", 
          "userId": "admin", 
          "status": "Completed", 
          "jobType": "Excel Upload" 
         } 
        ] 
       }; 
var jobs = data1; 
var datae = new google.visualization.DataTable(); 

datae.addRows(["datetime",jobs.jobstatus.dateAndTime], 
      ['jobId', jobs.jobstatus.jobId], 
      ['userId', jobs.jobstatus.userId], 
      ['status', jobs.jobstatus.status], 
      ['jobType', jobs.jobstatus.jobType] 
    );}); 

</script> 

私のコードですか？また、その同じエラーを取得しています、これを追加することにより

google.load('visualization', '1.0', {'packages':['corechart'], 'callback': read});

：私は彼らが私はこの行を追加すると、「SO」にそのための解決策を探しました。誰かがこれから私を助けることができますか？ここ

Answer 1

いくつかの推奨事項が...

1ですが）古いライブラリjsapi

<script src="https://www.gstatic.com/charts/loader.js"></script>

2対loader.jsの使用を推奨します）callback機能に名前を付けるのではなく、変数への代入

google.charts.load('current', { 
    callback: read, 
    packages:['table'] 
}); 

function read(){...} 

3）より前に列を追加する必要がありますdata1、"jobstatus"でこれを行うにはいくつかの方法は、arrayToDataTableを使用する

var datae = google.visualization.arrayToDataTable([ 
    ['datetime', 'jobId', 'userId', 'status', 'jobType'], 
]); 

4容易である）は、アレイであるので、アクセス値に配列要素のインデックスを使用する必要があり

jobs.jobstatus[0].dateAndTime // get first array element with [0]

、-OR -

jobstatusが配列内にある場合は、ループを使用してすべてを追加します。addRow

jobs.jobstatus.forEach(function (job) { 
    datae.addRow([ 
    job.dateAndTime, 
    job.jobId, 
    job.userId, 
    job.status, 
    job.jobType 
    ]); 
}); 

...

google.charts.load('current', { 
 
    callback: read, 
 
    packages:['table'] 
 
}); 
 

 
function read(){ 
 
    var data1={ 
 
    "jobstatus": [{ 
 
     "dateAndTime": "hi", 
 
     "jobId": "TCC_tfc", 
 
     "userId": "admin", 
 
     "status": "Completed", 
 
     "jobType": "Excel Upload" 
 
    }] 
 
    }; 
 
    var jobs = data1; 
 

 
    var datae = google.visualization.arrayToDataTable([ 
 
    ['datetime', 'jobId', 'userId', 'status', 'jobType'], 
 
    ]); 
 

 
    jobs.jobstatus.forEach(function (job) { 
 
    datae.addRow([ 
 
     job.dateAndTime, 
 
     job.jobId, 
 
     job.userId, 
 
     job.status, 
 
     job.jobType 
 
    ]); 
 
    }); 
 

 
    var chart = new google.visualization.Table(document.getElementById('chart_div')); 
 
    chart.draw(datae); 
 
}

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="chart_div"></div>