【问题标题】:google maps api v3 marker click not working谷歌地图 api v3 标记点击不起作用
【发布时间】:2011-07-19 13:41:56
【问题描述】:

不确定问题出在哪里,几个月前我使用 api 的 v3 创建了一个带有自定义标记的谷歌地图。那时信息窗口还在工作。

我一直在将它移植到一个新站点并且无法打开信息窗口,创建点击事件时 js 在正确的点发出警报,但点击事件没有触发我所能做的就是拖动地图,所以我查看了上一个站点,但现在也无法正常工作。

所以不知道如何解决这个问题,我必须创建信息窗口的代码如下:

markersArray.push(marker);
        markersPosArray.push(myLatLng);
        // Wrapping the event listener inside an anonymous function
        // that we immediately invoke and passes the variable i to.
        (function(myData, marker) {
            alert('creating listener for: '+marker);
            // Creating the event listener. It now has access to the values of
            // myData and marker as they were during its creation
            google.maps.event.addListener(marker, 'click', function() {
                //create thecontent for the infowindow
                alert('creating info window');
                var content = 'hello there'; //createContent(myData);
                infowindow.setContent(content);
                infowindow.open(map, marker);
            });


        })(myData, marker); 

也许我不知道的 api 发生了一些变化?

测试页面可见:http://www.disposalknowhow.com/locator.php 在定位器中使用以下内容获取结果:

类型:电气/电子 - 项目:计算机 - 半径:100 - 邮政编码:n11hl

我之前做的那个现在也不起作用可以在:http://www.focus-on-plants.com/locator_iconed.php (可以在表单中使用任何参数)

更新:

回复trefys的回答:

信息窗口是在我创建地图时定义的:

var myLatLng = new google.maps.LatLng(51.470, -0.00);
    var bounds = new google.maps.LatLngBounds();
    var geocoder = new google.maps.Geocoder();
    var gotIcons = false;
    var iconImageArray = {image:{}, size:{}, sizeX:{}, sizeY:{}, origin:{}, originX:{}, originY:{}, anchorpoint:{}, anchorpointX:{}, anchorpointY:{}};
    var iconShadowArray = {image:{}, size:{}, sizeX:{}, sizeY:{}, origin:{}, originX:{}, originY:{}, anchorpoint:{}, anchorpointX:{}, anchorpointY:{}};
    var iconShapeArray = {poly:{}, coord:{}};
    var myIconArray = {icon:{}, shadow:{}, shape:{}}
    var infowindow = new google.maps.InfoWindow();
    var markersArray = []; // to store out markers
    var markersPosArray = []; // to store lat/lang of markers for zooming function
    var markersInfoArray = [];
    // MAP OPTIONS
    var myOptions = {
        zoom: 5,
        center: myLatLng,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        mapTypeControl: true,
        mapTypeControlOptions: {
            style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
            position: google.maps.ControlPosition.BOTTOM
        },
        navigationControl: true,
        navigationControlOptions: {
            style: google.maps.NavigationControlStyle.ZOOM_PAN,
            position: google.maps.ControlPosition.TOP_RIGHT
        },
        scaleControl: true,
        scaleControlOptions: {
            position: google.maps.ControlPosition.TOP_LEFT
        }
    };//end map options
    var map = new google.maps.Map(document.getElementById("loc_map"), myOptions);

【问题讨论】:

  • 你的点击事件回调中变量infowindow从哪里来?
  • 嗯,这是个好问题,我想你已经发现了我的错误,我会在下面尝试你的代码并报告,谢谢
  • 检查了脚本并在我创建地图时定义了信息窗口,请在问题中查看我的更新
  • 似乎可以根据您网站的代码jsfiddle.net/kjy112/4fZbF

标签: javascript jquery google-maps-api-3 infowindow


【解决方案1】:

我正在使用以下代码来显示信息气泡:

var info_pane = new google.maps.InfoWindow({
                    content: info,
                    disableAutoPan: false,
                    maxWidth: '300px'
                });
info_pane.open(map, marker);

【讨论】:

  • 尝试使用此代码,但仍然没有信息窗口,它提醒正在为每个图标创建侦听器
  • 嗯...我不确定。我无法为您提供指向我正在使用该代码的网站的链接,因为不幸的是它尚未上线。查看您的代码,没有任何东西会立即跳出来。
  • 我也卡住了,正如我所说的,几个月前我做了一个网站时的代码工作现在不显示信息窗口,没有生成错误,很难知道在哪里看,警报就在 on-click 的创建工作之前,所以我认为问题出在 onclick 侦听器中的某个地方,但代码对我来说看起来不错......
  • @Dizzy 实际上你不需要为 onclick 事件使用闭包你基本上可以设置infowindow.open(map, this); 并删除闭包jsfiddle.net/kjy112/4fZbF
猜你喜欢
  • 2014-01-15
  • 1970-01-01
  • 1970-01-01
  • 2014-03-05
  • 1970-01-01
  • 1970-01-01
  • 2012-09-27
  • 2019-09-23
  • 1970-01-01
相关资源
最近更新 更多