Отправить заявку

Накладываем свой собственный слой на Google Maps

Иногда необходимо на карту Google поместить собственный слой, который будет поверх всех слоев Google Maps. Это легко реализовать - тем более сам Google это разрешает делать его же свойствами.

Функция наложения слоя на Google Maps:

function MyControl(map) {
	this.map = map;	
	
	this.button = document.createElement('DIV');
	this.button.style.margin = "50px";
	this.button.style.padding = "20px";
	this.button.style.backgroundColor = "#fff";
	this.button.style.fontSize = "25px";
	this.button.style.cursor = "pointer";
	this.button.appendChild(document.createTextNode("НАКЛАДЫВАЕМЫЙ СЛОЙ"));
	
	this.div = document.createElement('DIV');
	this.div.appendChild(this.button);

	var marker = new google.maps.Marker({
		position : new google.maps.LatLng(37.074301,22.432584)
	});
	
	google.maps.event.addDomListener(this.button, "click", function(e){
		if (marker.getMap()){
			marker.setMap(null); 
		} else {
			marker.setMap(map);
		}
	}); 
}

MyControl.prototype.getDiv = function() {
	return this.div;
};

MyControl.prototype.remove = function() {
	this.div.removeChild(this.button);
	this.div.parentNode.removeChild(this.div);
};

google.maps.event.addDomListener(window, 'load', function(){

    var map = new google.maps.Map(document.getElementById("map"), {
		zoom: 1,
		center: new google.maps.LatLng(0,0),
		mapTypeId: google.maps.MapTypeId.HYBRID,
    });
	
	var myControl = new MyControl(map);
	map.controls[google.maps.ControlPosition.TOP].push(myControl.getDiv());

});
Другие публикации