Проблема собственно вот в чём: у меня есть связь между XML и google api maps v3, так как в этой версии (V3) не предусмотрен класс "GDownloadUrl" как во второй версии, а она необходима очень, немного "погуглив" я наткнулся на вариант делать это с помощью jQuery, собственно не долго думая, я воспользовался примером. Всё заработало. Всё замечательно. Но теперь есть некая проблема, есть такая возможность в V3 google API работать с окружностью (google.maps.Circle), вот пример кода: | Код |
$(document).ready(function() {
var myLatLng = new google.maps.LatLng(48.00100, 37.82000);
MYMAP.init('#map', myLatLng, 13);
$("#map").ready(function(e){
MYMAP.placeMarkers('data.xml');
});
});
var MYMAP = {
map: null,
bounds: null
}
MYMAP.init = function(selector, latLng, zoom) {
var myOptions = {
zoom:zoom,
center: latLng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
this.map = new google.maps.Map($(selector)[0], myOptions);
this.bounds = new google.maps.LatLngBounds();
}
var map, circle, circleOptions, setCenter, marker;
MYMAP.placeMarkers = function(filename) {
$.get(filename, function(xml){
$(xml).find("marker").each(function(){
var name = $(this).find('name').text();
var address = $(this).find('message').text();
// create a new LatLng point for the marker
var lat = $(this).find('lat').text();
var lng = $(this).find('lng').text();
var pic = $(this).find('img').text();
if($(this).find('url').text())
{
var url = $(this).find('url').text();
}else{
var url = "null"
}
var point = new google.maps.LatLng(parseFloat(lat),parseFloat(lng));
// extend the bounds to include the new point
MYMAP.bounds.extend(point);
var marker = new google.maps.Marker({
position: point,
icon: pic,
map: MYMAP.map
});
var infoWindow = new google.maps.InfoWindow();
var html='<strong>'+name+'</strong><br />'+'<p>'+address+'</p>';
google.maps.event.addListener(marker, 'click', function() {
if(url!="null")
{
window.open(url);
}else{
infoWindow.setContent(html);
infoWindow.open(MYMAP.map, marker);
}
});
MYMAP.map.fitBounds(MYMAP.bounds);
setCenter = true;
circleOptions = {
fillColor:"#00AAFF",
fillOpacity:0.5,
strokeColor:"#FFAA00",
strokeOpacity:0.8,
strokeWeight:2,
clickable:true
}
google.maps.event.addListener(MYMAP.map, 'click', function(event) {
if (setCenter) {
markerCYC = new google.maps.Marker({
position:event.latLng,
clickable:false});
markerCYC.setMap(MYMAP.map);
circleOptions.center = event.latLng;
setCenter = false;
if (markerCYC != undefined) {
markerCYC.setMap(null);
}
}
else{
//рассчитываем расстояние между точками
var radius = distHaversine(circleOptions.center, event.latLng)
circleOptions.radius = radius*1000;
if (circle != undefined) {
circle.setMap(null);
}
circle = new google.maps.Circle(circleOptions);
circle.setMap(MYMAP.map);
//setCenter = true;
}
});
});
});
var rad = function(x) {return x*Math.PI/180;}
distHaversine = function(p1, p2) {
var R = 6371; // earth's mean radius in km
var dLat = rad(p2.lat() - p1.lat());
var dLong = rad(p2.lng() - p1.lng());
var a = Math.sin(dLat/2) * Math.sin(dLat/2) +
Math.cos(rad(p1.lat())) * Math.cos(rad(p2.lat())) * Math.sin(dLong/2) * Math.sin(dLong/2);
var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));
var d = R * c;
return d.toFixed(3);
}
}
|
Вот теперь окружность работает не правильно, она создается, только не удаляется :( подскажите такие вопросы: 1) Чтобы третий клик её удалял, а 4 её создавал вновь (так работало в примере без jQuery). 2) Как вывести хотябы алрертом, попавшие в область окружности marker`ы? |
Google API MAPS V3, jQuery + google.maps.Circle 
Дата 31.3.2011, 16:34 (
Загрузка ...
