Question

我有这个应用程序，我在谷歌地图图层上加载了一个kml文件。我有来自KML的这些点图层标记。现在，如何通过点击标记获得纬度/经度？请指导。

请找到我用于kmMouseEvent的以下代码：

   <%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Transit layer</title>
<style>
html,body,#map-canvas {
    height: 100%;
    margin: 0px;
    padding: 0px
}

html,body,#map-canvas {
    height: 100%;
    margin: 0px;
    padding: 0px
}

#panel {
    position: absolute;
    top: 5px;
    left: 50%;
    margin-left: -180px;
    z-index: 5;
    background-color: #fff;
    padding: 5px;
    border: 1px solid #999;
}

body {
  font-size: 0.8em;
}

#map-container, #side-container, #side-container li {
  float: left;
}

#map-container {
  width: 500px;
  height: 600px;
}

#side-container {
  border: 1px solid #bbb;
  margin-right: 5px;
  padding: 2px 4px;
  text-align: right;
  width: 260px;
}
#side-container ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
#side-container li input {
  font-size: 0.85em;
  width: 210px;
}
#side-container .dir-label {
  font-weight: bold;
  padding-right: 3px;
  text-align: right;
  width: 40px;
}

#dir-container {
  height: 525px;
  overflow: auto;
  padding: 2px 4px 2px 0;
}
#dir-container table {
  font-size: 1em;
  width: 100%;
}
</style>
<link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet"      type="text/css" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&libraries=places"></script>
<script type="text/javascript"   src="http://geoxml3.googlecode.com/svn/branches/polys/geoxml3.js"></script>
<script> 


function initialize() 
{ 
    var markers = [];  
    var myLatlng = new google.maps.LatLng(18.9800, 73.1000);       
    var mapOptions = 
        {     
            zoom: 15,     
            center: myLatlng,   
            mapTypeId: google.maps.MapTypeId.ROADMAP 
        };    
     var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);    
     //var transitLayer = new google.maps.KmlLayer('http://gmaps-samples.googlecode.com/svn/trunk/ggeoxml/cta.kml');
     //transitLayer.setMap(map);

    var geoXml = new geoXML3.parser({map: map, singleInfoWindow: true});
    geoXml.parse('kmload.kml'); 
     //var geoXml1 = new geoXML3.parser({map: map, singleInfoWindow: true});
    //geoXml1.parse('lines.kml'); 
        google.maps.event.addListener(geoXml, 'click', function(kmlEvent) 
        {
            alert(kmlEvent.latLng); 
        }); 
     }  


google.maps.event.addDomListener(window, 'load', initialize); 
    </script>
</head>
<body>

<div id="map-canvas" style="float: left; width: 70%; height: 100%;"></div>
</body>
</html>

请让我知道我哪里出错。

Answer 1

KMLLayer需要公共可用的KML文件。

GeoXML3不会创建KMLLayer，因此您无法使用KMLLayer的方法。

您必须覆盖GeoXML3的内置createMarker - 函数才能为标记应用自定义事件处理程序：

var geoXml = new geoXML3.parser(
  {
    map: map, 
    singleInfoWindow: true,
    createMarker: function(p){
      var that   = this,
          marker = new google.maps.Marker({position:p.latlng,map:that.map});
      google.maps.event.addListener(marker,'click',function(e){
            that.infoWindow.setContent(e.latLng.toString());
            that.infoWindow.open(that.map,this);
    });
   }});

点击Google Maps API中的标记即可获得LatLong

1 个答案: