Javascript 谷歌地图未在点击事件中注册

我试图在点击事件中在地图上创建一个圆圈。以下是

tab1.js

下映射的初始化：

function initMap() {
    forecastmap = new google.maps.Map(document.getElementById('forecastmap'), {
      center: {lat: 1.352083, lng: 103.81983600000001},
      zoom: 11
    });
    forecastmap.addListener('click', function(e) {
        createBuffer(e.latLng, forecastmap);
    });

    geocoder = new google.maps.Geocoder();
    infowindow = new google.maps.InfoWindow();
}

然后在我的

tab2.js

中执行所有逻辑以添加标记：

function createBuffer(coord, forecastmap) {
    console.log('come in');
    var marker = new google.maps.Marker({
        position: coord,
        map: forecastmap
    });
    clusterData.push(marker);

    marker = new google.maps.Circle({
        center: coord,
        map: forecastmap,
        strokeColor: '#000',
        strokeWeight: 2,
        strokeOpacity: 0.5,
        fillColor: '#f0f0f0',
        fillOpacity: 0.5,
        radius: 20 * 1000
    });
    clusterData.push(marker);
}

我插入了一条伪消息来检查单击事件是否已注册。然而，这封信甚至没有打印出来。我想知道代码的哪一部分是错的

我的HTML分区：

<div class="box-body">

                                      <div id="forecastmap" style="width:100%;height:350px" onclick="initMap();"></div>


                                </div>

---

谢谢

请注意，

addListener

不是有效的方法，您可能正在寻找本地的，也可能是谷歌的

我对谷歌地图不太熟悉，但考虑到地图是动态生成的，

forecastmap

变量在页面加载时可能不可用。因此，您需要将作用域提升到页面加载时可用的元素，并使用

而不是：

forecastmap.addListener('click', function(e) {
    createBuffer(e.latLng, forecastmap);
});

您可能需要以下内容：

document.getElementsByTagName('body')[0].addEventListener("click", function(e) {
  // Check that the click target is #forecastmap
  if (e.target && e.target.id == "forecastmap") {
    createBuffer(e.latLng, forecastmap);
  }
});

---

希望这有帮助！：）

在map div（id=“forecastmap”的div）上有一个单击侦听器，它调用

initMap（）

函数（

onclick=“initMap（）”

），重新创建map，丢失您可能添加的任何圆。如果我删除它，并添加一个

google.maps.event.addDomListenerOnce（document.getElementById（“forecastmap”），…

，它在第一次单击（仅）时初始化了地图，那么我就会得到标记和圆圈

代码片段：

var预测图；
函数initMap（）{
forecastmap=new google.maps.Map（document.getElementById（'forecastmap'）{
中心：{
纬度：1.352083，
液化天然气：103.81983600000001
},
缩放：11
});
forecastmap.addListener（'click'，函数（e）{
createBuffer（如latLng、forecastmap）；
});
geocoder=新的google.maps.geocoder（）；
infowindow=new google.maps.infowindow（）；
}
//google.maps.event.addDomListener（窗口'load'，函数（）{
google.maps.event.addDomainListenerOnce（document.getElementById（'forecastmap'），“单击”，initMap）；
// });
函数createBuffer（坐标、预测图）{
console.log（'come-in'）；
var marker=new google.maps.marker({
职位：coord，
地图：预报图
});
//clusterData.push（标记器）；
marker=new google.maps.Circle({
中心：coord，
地图：预报图，
strokeColor:“#000”，
冲程重量：2，
笔划不透明度：0.5，
填充颜色：'#f0'，
填充不透明度：0.5，
半径：20*1000
});
//clusterData.push（标记器）；
}

html，
身体
#预报图{
身高：100%；
宽度：100%；
边际：0px；
填充：0px
}

您正在寻找的是

addEventListener

而不是

addListener

@obsidiange我试图从这里搜索：developers.google.com/maps/documentation/javascript/events，但我没有看到任何addEventListener。您介意向我提供语法吗？因为我将上面的内容更改为addEventListener，它告诉我nction未定义。我自己不使用谷歌地图，但显然有一个谷歌地图

addDomListener

：

Google.Maps.event.addDomListener

：。@obdimanage我试过使用addDomListener，但奇怪的是，它不起作用。放下投票人的心来解释一下吧？嘿，对不起，我把它放在哪里了第二段代码？在initMap（）中还有？但奇怪的是，我成功地将所有标记标绘到地图上，并能够单击标记项以显示信息窗口，只是当我单击地图时，它不会返回虚假消息，但我收到了以下错误消息：未捕获引用错误：谷歌未在addDomListener中定义这是另一个问题lem。您的问题中没有包含API的加载。加载方式与答案中的加载方式相同。但是JSFIDLE中的映射直到第一次单击才显示。有没有办法在加载映射时注册单击事件？