Google Maps JS V3中多边形的自定义InfoWindow

时间:2019-05-27 07:58:00

标签: javascript google-maps kml infowindow geoxml3

我需要知道是否可以自定义在“ Google我的地图”中创建的地图中单击“多边形”时出现的“信息窗口”。

我为您展示了一个打开了信息窗口的多边形的示例: https://imgur.com/a/bEDctSx

有些多边形的描述有20条或更多条线,我想减少信息窗口的高度(我不知道如何,也许在信息窗口内创建一张表格,然后按行放置两个村庄或...我需要一些想法)。

我的代码的一部分是(我不是Java专家)

function initialize() {
  myLatLng = new google.maps.LatLng(42.1273, -0.09988);
  var lat = 42.1273;
  var lng = -0.09988;
  var zoom = 18;
  var center = myLatLng;
  var maptype = google.maps.MapTypeId.ROADMAP; 
  var query = location.search.substring(1); 
  var pairs = query.split("&");
  for (var i=0; i<pairs.length; i++) {
var pos = pairs[i].indexOf("=");
var argname = pairs[i].substring(0,pos).toLowerCase();
var value = pairs[i].substring(pos+1).toLowerCase();

    if (argname == "id") {id = unescape(value);}
    if (argname == "filename") {
      filename = unescape(pairs[i].substring(pos+1)); // was value
      if (filename.indexOf(",") > 0) {
        filename = filename.split(",");
      }
    }
    if (argname == "marker") {index = parseFloat(value);}
    if (argname == "lat") {lat = parseFloat(value);}
    if (argname == "lng") {lng = parseFloat(value);}
    if (argname == "zoom") {
  zoom = parseInt(value);
  myGeoXml3Zoom = false;
}
    if (argname == "type") {
      if (value == "m") {maptype = google.maps.MapTypeId.ROADMAP;}
      if (value == "k") {maptype = google.maps.MapTypeId.SATELLITE;}
      if (value == "h") {maptype = google.maps.MapTypeId.HYBRID;}
      if (value == "t") {maptype = google.maps.MapTypeId.TERRAIN;}
    }
  }
  if (!isNaN(lat) && !isNaN(lng)) {
    myLatLng = new google.maps.LatLng(lat, lng);
  }
            var myOptions = {
                zoom: zoom,
                center: myLatLng,
                // zoom: 5,
                // center: myLatlng,
                mapTypeId: maptype
            };
            map = new google.maps.Map(document.getElementById("map_canvas"),
                  myOptions);
            infowindow = new google.maps.InfoWindow({}); 
showLoad();
   var a = performance.now();
   geoXml = new geoXML3.parser({
                map: map,
                infoWindow: infowindow,
                singleInfoWindow: true,
        zoom: myGeoXml3Zoom,
        markerOptions: {optimized: false},
                afterParse: useTheData,
                failedParse: geoxmlErrorHandler
            });
   google.maps.event.addListener(geoXml,'parsed', function() {
   var b = performance.now();
     hideLoad();
   });
            geoXml.parse(filename);
    google.maps.event.addListener(map, "bounds_changed", makeSidebar);
    google.maps.event.addListener(map, "center_changed", makeSidebar);
    google.maps.event.addListener(map, "zoom_changed", makeSidebar);
    google.maps.event.addListenerOnce(map, "idle", makeSidebar);
  // Make the link the first time when the page opens
  makeLink();

  // Make the link again whenever the map changes
  google.maps.event.addListener(map, 'maptypeid_changed', makeLink);
  google.maps.event.addListener(map, 'center_changed', makeLink);
  google.maps.event.addListener(map, 'bounds_changed', makeLink);
  google.maps.event.addListener(map, 'zoom_changed', makeLink);
   };

0 个答案:

没有答案