Monday, 2 March 2015

Google Maps Marker API - Center einstellen topx







Hallo,

ich habe mit Google Maps Marker API einen Code geschrieben bzw. eher zusammenkopiert und halb verstanden, der auch wunderbar klappt. Es geht mir darum viele (!!!) Marker auf die Karte zu setzen. Der Code läuft momentan auch wunderbar. Nun würde ich allerdings gerne den Mittelpunkt (center) und die Zoomstufe voreinstellen. In meinem momentanen Code richtet sich das nach den gesetzten Markern, was ich gerne ändern würde. Dass das unter 'function initialize()' stehen muss ist mir klar, allerdings kriege ich das mit dem voreingestellten Center nicht zum laufen, weshalb ich eure Hilfe benötige.

Schätze ich muss folgende Variable irgendwo einsetzen:


var mapOptions = {
zoom: 7,
center: new google.maps.LatLng(9.22316, 52.35308)


Allerdings: Wo und was muss ich dafür löschen?

Das ist der aktuelle Code:



Zitat:










<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script>
var map;





var LocationData = [ xxx, yyy, zzz, 0];


var iconURLPrefix = 'http://maps.google.com/mapfiles/ms/icons/';

var icons = [
iconURLPrefix + 'red-dot.png',
iconURLPrefix + 'green-dot.png',
iconURLPrefix + 'blue-dot.png',
iconURLPrefix + 'orange-dot.png',
iconURLPrefix + 'purple-dot.png',
iconURLPrefix + 'pink-dot.png',
iconURLPrefix + 'yellow-dot.png'
]




function initialize()
{
var map =
new google.maps.Map(document.getElementById('map-canvas'));
var bounds = new google.maps.LatLngBounds();
var infowindow = new google.maps.InfoWindow();


for (var i in LocationData)
{
var p = LocationData[i];
var latlng = new google.maps.LatLng(p[0], p[1]);
bounds.extend(latlng);

var marker = new google.maps.Marker({
position: latlng,
map: map,
icon : icons[p[3]],
title: p[2]
});

google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(this.title);
infowindow.open(map, this);
});
}

map.fitBounds(bounds);
}



google.maps.event.addDomListener(window, 'load', initialize);

</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>





Vielen Dank für eure Hilfe!

Max









No comments:

Post a Comment