主页 / 问题 / 759352
Accepted
Студеникин Максим
Asked:2020-12-17 05:55:42 +0000 UTC2020-12-17 05:55:42 +0000 UTC

如果使用 webpack 和 pug，如何包含谷歌地图（JS）

  • 772

这是我尝试连接 http://prntscr.com/hog3hi时遇到的错误

哈巴狗代码

脚本（src=' https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback= initMap '）

js代码

让 initMap = function() { 让 uluru = {lat: -25.363, lng: 131.044}; 让 map = new google.maps.Map(document.getElementById('map'), {zoom: 4, center: uluru}); let marker = new google.maps.Marker({position: uluru, map: map}); };

google-maps

1 个回答

  1. Best Answer

    我应该更加小心。）

    首先，我没有使用自己的 api 来制作地图

    其次，问题还在于 initMap 函数不是全局的。

    更多细节可以在这里找到 https://stackoverflow.com/questions/37656592/define-global-variable-with-webpack

    这是一个工作示例

    我们在 pug div#map 脚本中放了什么（src=' https://maps.googleapis.com/maps/api/js?key=Your__api__key&callback=initMap ', async defer）

    我们插入到页面的js文件中的代码

    var initMap = () => { var uluru = {lat: -25.363, lng: 131.044}; var map = new google.maps.Map(document.getElementById('map'), {zoom: 4, center: uluru}); var marker = new google.maps.Marker({position: uluru, map: map}); };

    一个非常重要的部分。您需要指定一个或两个

    全局.initMap = initMap;

    窗口.initMap = initMap;

    我希望这可以帮助你

    • 1

相关问题