Google maps api 3 kml层信息窗口

Google maps api 3 kml层信息窗口,google-maps-api-3,kml,infowindow,Google Maps Api 3,Kml,Infowindow,我正在努力找到一种方法来设计这张地图上的信息窗口。我尝试通过设置suppressInfoWindows:true来抑制infowindow,但这似乎不起作用。任何想法都将受到高度赞赏。我在这里读了很多谷歌文档和很多其他帖子,但找不到解决方案 <script> var geocoder; var map; var marker; var layers = []; function initialize() { geocoder = new google.maps.Geo

我正在努力找到一种方法来设计这张地图上的信息窗口。我尝试通过设置suppressInfoWindows:true来抑制infowindow,但这似乎不起作用。任何想法都将受到高度赞赏。我在这里读了很多谷歌文档和很多其他帖子,但找不到解决方案

     <script>

var geocoder;
var map; 
var marker;
var layers = [];

function initialize() {
geocoder = new google.maps.Geocoder ();
var latlng = new google.maps.LatLng (51.505288, -0.191544);
var myOptions = {
  zoom: 15,
  disableDefaultUI: true,
  styles: [
        {
           stylers: [

  ]
},

{
  featureType: "poi.park",
  stylers: [
      { color: "#aecfae" },
    { saturation: 0 },
    { lightness: 0 },
    { visibility: "simplified" }



  ]
  },

  {
  featureType: "landscape",
  stylers: [
      { color: "#ffffff" },
    { saturation: 0 },
    { lightness: 0 },
    { visibility: "simplified" }
  ]
},

{
  featureType: "road.highway",
  elementType: "labels",
  stylers: [
    { color: "transparent" },
    { visibility: "off" },

  ]
},

{
  featureType: "water",
  elementType: "geometry.fill",
  stylers: [
    { color: "#a5bfdd" },
    { visibility: "on" },

  ]
},

{
  featureType: "road",
  elementType: "labels",
  stylers: [
    { color: "transparent" },
    { visibility: "off" },

  ]
},

  {
  featureType: "road",
  elementType: "geometry",
  stylers: [
      { color: "#e0e0e0" },
    { saturation: 0 },
    { lightness: 0 },
    { visibility: "simplified" }
  ]
}],
  center: latlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
    }
  map = new google.maps.Map(document.getElementById("map_canvas"),
    myOptions);

  marker = new google.maps.Marker({map:map});

     layers[0] = new google.maps.KmlLayer('http://www.cid-dev.co.uk/vicarage-phase-2/kml/VicarageGate.kml', {preserveViewport: true});

    for (var i = 0; i < layers.length; i++) {
    layers[i].setMap(map);


  }

  layers[1] = new google.maps.KmlLayer('http://www.cid-dev.co.uk/vicarage-phase-2/kml/PrimarySchools-1.kml',
         {preserveViewport: true});
  layers[2] = new google.maps.KmlLayer('http://www.cid-dev.co.uk/vicarage-phase-2/kml/SecondarySchools-1.kml', {preserveViewport: true});
  layers[3] = new google.maps.KmlLayer('http://www.cid-dev.co.uk/vicarage-phase-2/kml/Culture-6.kml', {preserveViewport: true});
  layers[4] = new google.maps.KmlLayer('http://www.cid-dev.co.uk/vicarage-phase-2/kml/Hotels-2.kml', {preserveViewport: false});
   layers[5] = new google.maps.KmlLayer('http://www.cid-dev.co.uk/vicarage-phase-2/kml/Shopping.kml', {preserveViewport: false});
   layers[6] = new google.maps.KmlLayer('http://www.cid-dev.co.uk/vicarage-phase-2/kml/Restaurants.kml', {preserveViewport: false});
  for (var i = 1; i < layers.length; i++) {
    layers[i].setMap(null);


  }
    }
function codeAddress () {
    var address = document.getElementById ("address").value;
    geocoder.geocode ( { 'address': address}, function(results, status)  {
    if (status == google.maps.GeocoderStatus.OK)  {
        map.setCenter(results [0].geometry.location);
        marker.setPosition(results [0].geometry.location);
        map.setZoom(15);
        } 
    else {
        alert("Geocode was not successful for the following reason: " + status);
            }
}); 
}

function toggleLayer(i) {
  if(layers[i].getMap() === null) {
    layers[i].setMap(map);
  }
  else {
    layers[i].setMap(null);
  }






}


  google.maps.event.addDomListener(window, 'load', initialize);






    </script>



    <div id="map_canvas" style="position:absolute; width:100%; height:100%; top:0px; left:0px; right:0px; bottom:0px; z-index:100; background-color:#000;"></div>

var地理编码器;
var映射;
var标记;
var层=[];
函数初始化(){
geocoder=newgoogle.maps.geocoder();
var latlng=新的google.maps.latlng(51.505288,-0.191544);
变量myOptions={
缩放:15,
disableDefaultUI:true,
风格:[
{
样式:[
]
},
{
功能类型:“poi.park”,
样式:[
{颜色:#aecfae},
{饱和度:0},
{亮度:0},
{可见性:“简化”}
]
},
{
特色类型:“景观”,
样式:[
{颜色:#ffffff},
{饱和度:0},
{亮度:0},
{可见性:“简化”}
]
},
{
功能类型:“道路。公路”,
elementType:“标签”,
样式:[
{color:“透明”},
{可见性:“关闭”},
]
},
{
特色类型:“水”,
elementType:“几何体.填充”,
样式:[
{颜色:#a5bfdd},
{可见性:“}”,
]
},
{
特色类型:“道路”,
elementType:“标签”,
样式:[
{color:“透明”},
{可见性:“关闭”},
]
},
{
特色类型:“道路”,
elementType:“几何体”,
样式:[
{颜色:#e0},
{饱和度:0},
{亮度:0},
{可见性:“简化”}
]
}],
中心:拉特林,
mapTypeId:google.maps.mapTypeId.ROADMAP
}
map=new google.maps.map(document.getElementById(“map_canvas”),
肌肽);
marker=newgoogle.maps.marker({map:map});
层[0]=新的google.maps.kmlayer('http://www.cid-dev.co.uk/vicarage-phase-2/kml/VicarageGate.kml“,{preserveViewport:true});
对于(变量i=0;i
禁止自动生成信息窗口,并使用单击事件手动处理数据


下面是一个从信息窗口链接中删除
target=“\u blank”
属性的示例:

您可以尝试向所有标记添加类似的方法

// generalized click handler
function addClickHandler(item, content, position) {
  google.maps.event.addListener(item, 'click', function () {
    infoWindow.close();
    infoWindow.setContent(content);
    infoWindow.setPosition(position);
    infoWindow.open(map);
  });
}

当我使用KML设计样式时,您是如何使用suppressInfoWindows的?我在你发布的代码中没有看到它。很抱歉,geocodezip,我从这个代码中删除了它,我只是在使用{suppressInfoWindows:true}。信息窗口在我不抑制它们的情况下工作,但我想抑制它们以显示样式化的信息窗口(如果这有意义的话)?你的问题不是“如何抑制现有的信息窗口”,而是“如何添加自定义信息窗口”?可能是Hi Chad的复制品,谢谢你的辛勤工作。我专门研究HTML和PHP,我的Jquery/Javascript知识还处于初级阶段。我如何将您的代码集成到我的代码中,以提供所需的切换效果,同时显示自定义css信息窗口问候您,Rob。同样的概念,您只需在“单击”事件侦听器代码中替换自定义信息窗口代码(而不是我的CommonInfoWindow)。您可以尝试Google Maps实用程序库的InfoBubble类: