У меня есть этот код:
<div id="map_canvas"></div>
<script>
window.onload = function () {
var styles = [{"featureType":"all"}];
var bounds = new google.maps.LatLngBounds();
var options = {
mapTypeControlOptions: {
mapTypeIds: ['Styled']
},
center: new google.maps.LatLng(11, 22),
zoom: 15,
disableDefaultUI: true,
mapTypeId: 'Styled'
};
marker = new google.maps.Marker({
map:map,
});
var div = document.getElementById('map_canvas');
var map = new google.maps.Map(div, options);
var styledMapType = new google.maps.StyledMapType(styles, { name: 'Styled' });
var markers = [
[
'Atrakcja 1 pl',
51.73925413,
19.51309225,
'Atrakcja 1 pl',
'#'
],
[
'Atrakcja 2 PL',
53.41475000,
14.60220358,
'Atrakcja 2 PL',
'#'
],
];
var infoWindow= new google.maps.InfoWindow({maxWidth:600}),
marker, i,
image = 'http://localhost/assets/poi.png';
for( i = 0; i < markers.length; i++ ) {
var beach = markers[i];
var position = new google.maps.LatLng(beach[1], beach[2]);
bounds.extend(position);
marker = new google.maps.Marker({
position: position,
map: map,
icon: image,
title: beach[0],
myurl: beach[4]
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infoWindow.setContent('<a href="'+marker['myurl']+'">'+marker['title']+'</a>');
infoWindow.open(map, marker);
}
})(marker, i));
map.fitBounds(bounds);
map.mapTypes.set('Styled', styledMapType);
}
}
</script>
Код создает карту Google со многими маркерами. В приведенном выше примере есть 2 балла. Точки центрированы на карте.
Я хотел бы добавить еще один момент:
['Main Point', 51.424150124, 14.6032790-8, 'Main Point', '#']
о маркере:
image2 = 'http://localhost/assets/poi2.png';
Как я могу сделать это в моем коде?
Я хотел бы иметь 2 типа маркеров на карте (2 цвета).