P粉3842444732023-08-23 20:45:44
https://maps.googleapis.com/maps/api
不支援從前端JavaScript中的網路應用程式取得請求,以您的程式碼嘗試使用它的方式。
相反,您必須使用支援的Google Maps JavaScript API,其客戶端程式碼與您嘗試的方式不同。一個距離矩陣服務範例如下:
<script> var service = new google.maps.DistanceMatrixService; service.getDistanceMatrix({ origins: [origin1, origin2], destinations: [destinationA, destinationB], travelMode: 'DRIVING', unitSystem: google.maps.UnitSystem.METRIC, avoidHighways: false, avoidTolls: false },… </script> <script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"> </script>
這裡是使用Place Autocomplete API的範例使用Places函式庫:
<script> function initMap() { var map = new google.maps.Map(document.getElementById('map'), { center: {lat: -33.8688, lng: 151.2195}, zoom: 13 }); ... map.controls[google.maps.ControlPosition.TOP_RIGHT].push(card); var autocomplete = new google.maps.places.Autocomplete(input); autocomplete.bindTo('bounds', map); var infowindow = new google.maps.InfoWindow(); var infowindowContent = document.getElementById('infowindow-content'); infowindow.setContent(infowindowContent); var marker = new google.maps.Marker({ map: map, anchorPoint: new google.maps.Point(0, -29) }); </script> <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places&callback=initMap" async defer></script>
像這樣使用Maps JavaScript API-透過使用