2013-11-18 7 views
-1

У меня есть это приложение, в котором я загрузил файл kml над слоем карты google. У меня есть эти маркеры уровня точки из KML. Теперь, как я могу получить lat/long при нажатии маркеров ?. Пожалуйста, направляйте.Получить LatLong при щелчке маркеров в API Карт Google

Пожалуйста, найдите ниже код, который я использовал для 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> 

Пожалуйста, дайте мне знать, где я буду неправильно.

+3

https://developers.google.com/maps/documentation/javascript/reference ? hl = en & csw = 1 # KmlMouseEvent –

+0

Dr.Molle: Я добавил код, где я использовал kmlmouseevent, но он, похоже, не работает. Не могли бы вы рассказать, где я ошибаюсь. – sTg

+0

Определить «не работает»! Когда я заменяю URL-адрес KML-файла на путь к существующему KML-файлу и использую 'console.log (kmlEvent.latLng);' внутри обратного вызова click я получаю ожидаемый результат. –

ответ

2

Для KMLLayer необходим общедоступный KML-файл.

GeoXML3 не создает KMLLayer, поэтому вы не можете использовать с ним методы KMLLayer.

Вы должны переопределить встроенный createMarker -функции GeoXML3 применять пользовательское событие-обработчик для маркеров:

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); 
    }); 
    }}); 
+0

Bingo.Это помогло. Это именно то, что я хотел. :-) – sTg

Смежные вопросы