Maps javascriptAPIを使って、スプレットシートのデータをグーグルマップに同期させる

前提・実現したいこと

Maps javascriptAPIを使って、スプリットシートの情報をグーグルマップにリアルたいむで、同期させたいのですが、スプリットシートの情報が出てきません。
GitHubにある、champierre/sheet2gmap のソースコードをほとんどコピーしており、ビジョアルスタジオコードでは、現時点で「問題は、ワークスペースでは、検出されていません」とでています。
ＡＰＩキーは所得していませんが、ホームページ上では、グーグルマップに緯度経度zoomレベルが記入された通りに出てきており、サイドバーの表示も出ているのですが、その中に、スプレットシートの情報や、グーグルマップに、マーカーも表示されていません。
スプレットシートの取り込み方に問題があるのでしょうか?

発生している問題・エラーメッセージ

Google chromeのF12を押して出てくるconsoleのエラーメッセージです。

ido_keido_zoom.js:40 GET https://sheets.googleapis.com/v4/spreadsheets/$1XGUPUQZqc8fWlGeBGD-_XMQ0f1B8R97f7eQmGJIZ8IQ/values/sheet1? 403
initMap @ ido_keido_zoom.js:40
(anonymous) @ js?&callback=initMap:144
(anonymous) @ js?&callback=initMap:144
Promise.then (async)
Nj @ js?&callback=initMap:144
google.maps.Load @ js?&callback=initMap:14
(anonymous) @ js?&callback=initMap:254
(anonymous) @ js?&callback=initMap:254
ido_keido_zoom.js:7 Uncaught TypeError: Cannot read property '0' of undefined
at parseData (ido_keido_zoom.js:7)

該当のソースコード

HTMLのソースコード

<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>マンション情報</title> <style> #map{ width:640px; height:400px; } #sidebar { position: absolute; top: 8%; left: 57%; width: 15%; height: 80%; border: 1px solid #666; padding: 6px; background-color: white; font-family: Meriyo UI; font-size: 14px; } </style> </head> <body>

<p>マンション情報</p>

<div id="map"> </div>
<td><div id="sidebar"></div></td>

<script type="text/javascript" src="ido_keido_zoom.js">    //緯度、経度、ズームレベルを取得するjavascript
</script>  
  
<script async defer            
  src="https://maps.googleapis.com/maps/api/js?&callback=initMap">    //google API取得
</script>

</body> </html>

javascriptのソースコード
var map;
var marker = [];
var infoWindow = [];
var windowOpened;

  function parseData(data) {
    var keys = data.values[0];
    var markerData = [];
    data.values.forEach(function(value, i) {
      if (i > 0) {
        var hash = {};
        value.forEach(function(d, j) {
          hash[keys[j]] = d;
        });
        markerData.push(hash);
      }
    });
    return markerData;
  }

  function initMap() {
    var target = document.getElementById('map');
    var centerp = {lat: 35.6679191, lng: 139.4606805};

    map = new google.maps.Map(target, {
      center: centerp,
      zoom: 17,
    });

    var request = new XMLHttpRequest();
    request.open('GET', `https://sheets.googleapis.com/v4/spreadsheets/$1XGUPUQZqc8fWlGeBGD-_XMQ0f1B8R97f7eQmGJIZ8IQ/values/sheet1?`, true);
    request.responseType = 'json';

    request.onload = function () {
      var data = this.response;
      var markerData = parseData(data);
      setData(markerData);
    };

    request.send();
  }

  function addMarker(i, data) {
    var markerLatLng = new google.maps.LatLng({
      lat: Number(data['緯度']),
      lng: Number(data['経度'])
    });
    marker[i] = new google.maps.Marker({
      position: markerLatLng,
      map: map
    });

    var info = '<div style="font-size:18px;font-weight:bold;margin-bottom:10px;">' + data['名称'] + '</div>';
    infoWindow[i] = new google.maps.InfoWindow({
      content: info
    });

    markerEvent(i);
  }

  function setData(markerData){
    var sidebar_html = "";
    for (var i = 0; i < markerData.length; i++) {
      var latitude = markerData[i]['緯度'];
      if (!latitude) { continue; }
      addMarker(i, markerData[i]);
      var name = markerData[i]['名称'];

      sidebar_html += `<b>${i + 1}</b> <a href="javascript:openWindow(${i})">${name}</a><br />`;
    }

    document.getElementById("sidebar").innerHTML = `<a target="_blank" href="https://docs.google.com/spreadsheets/d/$1XGUPUQZqc8fWlGeBGD-_XMQ0f1B8R97f7eQmGJIZ8IQ/edit?usp=sharing">元データ(Google スプレッドシート)</a><br /><a target="_blank" href="https://github.com/champierre/sheet2gmap">ソースコード(GitHub)</a><br /><br />` + sidebar_html;
  }

  function markerEvent(i) {
    marker[i].addListener('click', function() {
      openWindow(i);
    });
  }

  function openWindow(i) {
    if(windowOpened){
      windowOpened.close();
    }
    infoWindow[i].open(map, marker[i]);
    windowOpened = infoWindow[i];
  }

試したこと

スプリットシートの指定の仕方を
1XGUPUQZqc8fWlGeBGD-_XMQ0f1B8R97f7eQmGJIZ8IQにしたり、
{1XGUPUQZqc8fWlGeBGD-_XMQ0f1B8R97f7eQmGJIZ8IQ}にしたり、
$1XGUPUQZqc8fWlGeBGD-_XMQ0f1B8R97f7eQmGJIZ8IQにしたり
してみましたが、どれも変化しませんでした。。