谷歌地图点击标记功能问题

时间:2012-06-29 16:40:40

标签: jquery google-maps

你能只有一个window.location.href吗?

问题是点击时标记的最终点击功能是正确的。其余的甚至是输出不同(这是正确的)它们总是打开最后一个网址。

请注意cfloop。

  map = new google.maps.Map(document.getElementById("map"), options);
   // Create an Array for the Markers
   var markers = [];
     <cfloop array="#rc.details.poi.getPageRecords()#" index="local.poi">
      var latLng = new google.maps.LatLng(#local.poi.getpoiLat()#,#local.poi.getpoiLong()#);
      //var iconImg = '/assets/images/pin-50.png';

     <cfif !ArrayIsEmpty(local.poi.getimages())>
         var iconImg = new google.maps.MarkerImage("http://#CGI.HTTP_HOST#/plugins/api/index.cfm/image/#local.poi.getimages()[1].getimageID()#/50/50/get?apiKey=#application.factory.getBean('authenticationService').getAPIKey('image', 'GET')#&defaulttype=poi", null, new google.maps.Point(0,0), new google.maps.Point(0,0));
        <cfelse>
         var iconImg = new google.maps.MarkerImage("http://#CGI.HTTP_HOST#/plugins/api/index.cfm/image/1be71dec-a525-404f-a148-48ad74e46397/50/50/get?apiKey=#application.factory.getBean('authenticationService').getAPIKey('image', 'GET')#&defaulttype=poi", null, new google.maps.Point(0,0), new google.maps.Point(0,0));
      </cfif>

   var shadow = new google.maps.MarkerImage('/plugins/assets/images/AirTag50.png',
        // The shadow image is larger in the horizontal dimension
        // while the position and offset are the same as for the main image.
        new google.maps.Size(50, 80),
        new google.maps.Point(0,0),
        new google.maps.Point(0, 7));
        // Shapes define the clickable region of the icon.
        // The type defines an HTML <area> element 'poly' which
        // traces out a polygon as a series of X,Y points. The final
        // coordinate closes the poly by connecting to the first
        // coordinate.
    var shape = {
        coord: [1, 10, 10, 50, 55, 50,55 , 1],
        type: 'poly'
    };

    var URLonClick = "#buildURL(action='public:scape.view',queryString='scapeID=#local.poi.getScape().getscapeID()#&airtag=#local.poi.getpoiID()#')#";
     var marker = new google.maps.Marker({ position: latLng, map: map, draggable: false, title: 'Click to View AirTag', icon: iconImg, shadow: shadow, shape: shape, url: URLonClick });
     // Action Listener for the Marker
     google.maps.event.addListener(marker, 'click', function(event) {
            window.location.href = marker.url;
        });


      markers.push(marker);
    </cfloop>

    var mcOptions = {gridSize: 50, maxZoom: 15};
    var markerCluster = new MarkerClusterer(map, markers, mcOptions);        

2 个答案:

答案 0 :(得分:1)

关于功能关闭。当您在循环中创建标记时,var URLonClick的值会不断更新,因此最后它具有您放在其上的最后一个值。 解决方案是在您传递必要参数的单独函数中创建标记。

关于这个问题的好读物,在这里:

http://econym.org.uk/gmap/closure.htm

答案 1 :(得分:0)

问题是 marker.url

您正在覆盖每个循环上的marker-variable,因此marker.url将始终指向已创建的最后一个标记的url-member。

使用 this.url 代替 marker.url 来访问所点击标记的网址成员。