1

我正在创建一个带有融合层的谷歌地图，以便网站的访问者可以获取有关各个州技术人员的信息。这里是网站供参考：http ://horizo​​nwebtest.zxq.net/techmap.html地图需要锁定到美国大陆，所以我禁用了默认UI，可拖动，双击缩放，键盘快捷键，滚轮和自动平移。问题是当信息窗口弹出时，它仍然强制地图平移。有谁知道解决这个问题的方法？这是JavaScript：

// JavaScript Document
  function initialize() {
    var mapOptions = {
      center: new google.maps.LatLng(38.816223025492505, -94.15954943749999),
      zoom: 4,
      disableDefaultUI: true,
      draggable: false, 
      disableDoubleClickZoom: true,
      keyboardShortcuts: false,
      scrollwheel: false,
      disableAutoPan: true,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var horizonStyles = [
     {
        featureType: "water", 
            stylers: [ 
                { hue: "#0077ff" }, 
                { saturation: 20 }, 
                { lightness: -50 }, 
            ]
     },{
         featureType: "administrative.locality", 
            stylers: [ 
                { visibility: "off" } 
            ]
     },{
         featureType: "administrative.province",
         elementType: "labels.text.fill",
            stylers: [
                { lightness: -80 }
            ]
     }
    ];
    var layer = new google.maps.FusionTablesLayer({
        query: {
            select: 'geometry',
            from: '18KqZR_1Nd39CyWN1kKt8Pufd6wlLS2oQArpCugw'
        },
    });
    var map = new google.maps.Map(document.getElementById("map_canvas"),
        mapOptions);
    map.setOptions({styles: horizonStyles});
    layer.setMap(map);
}

任何想法将不胜感激。

4

1 回答 1

0

经过大量搜索和反复试验，似乎融合层不包含可编辑元素。要编辑信息框，您需要设置 suppressInfoWindows: true 然后创建您的信息窗口。这是完成的代码供参考：

// JavaScript Document
  function initialize() {
    var latlng = new google.maps.LatLng(38.816223025492505, -94.15954943749999); 
    var infoposition = new google.maps.LatLng(40, -81);
    var infowindow = new google.maps.InfoWindow({
      disableAutoPan: true,
      position: infoposition,
    });
    var infoWindowContent = '';
    var mapOptions = {
      center: latlng,
      zoom: 4,
      disableDefaultUI: true,
      draggable: false, 
      disableDoubleClickZoom: true,
      keyboardShortcuts: false,
      scrollwheel: false,
      disableAutoPan: true,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var horizonStyles = [
     {
        featureType: "water", 
            stylers: [ 
                { hue: "#0077ff" }, 
                { saturation: 20 }, 
                { lightness: -50 }, 
            ]
     },{
         featureType: "administrative.locality", 
            stylers: [ 
                { visibility: "off" } 
            ]
     },{
         featureType: "administrative.province",
         elementType: "labels.text.fill",
            stylers: [
                { lightness: -80 }
            ]
     }
    ];
    var layer = new google.maps.FusionTablesLayer({
        query: {
            select: 'geometry',
            from: '18KqZR_1Nd39CyWN1kKt8Pufd6wlLS2oQArpCugw',
        },
        suppressInfoWindows: true,
    });
    var map = new google.maps.Map(document.getElementById("map_canvas"),
        mapOptions);
    map.setOptions({styles: horizonStyles});
    layer.setMap(map);

//click listener on layer
google.maps.event.addListener(layer, 'click', function(e) {
if(infowindow) infowindow.close();
else infowindow;

//create info window layer
infoWindowContent = infowindow.setContent(
    '<p class="info_window" style="font-weight: bold">' + e.row['State'].value + '</p>' +
    '<p class="info_window">' + e.row['Number of Technicians'].value + ' technicians available<br>' +
    '<a href="http://horizonwebtest.zxq.net/contact/">Click here to schedule a service call or installation<br>' +
    'or <style="font-weight:bold">CALL 727-845-4444 NOW</style> for a live help desk<br>' +
    'person to assist you over the phone or to dispatch<br>' +
    'a technician to your site.</a></p>'
    );

map.setCenter(latlng);
infowindow.open(map);        
});
}

我希望对其他人有所帮助...

于 2012-08-20T01:40:00.350 回答