GoogleMaps – Custom Design

Eine coole Möglichkeiten wie man googleMaps mit angepasstem Deisgn in Webseiten integrieren kann:

<script type=”text/javascript” src=”https://maps.googleapis.com/maps/api/js?key=AIzaSyC0_fviymdBs9qTtnDEpfKEt4Huc5eY0Pg&sensor=false”></script>
<script type=”text/javascript”>
function initialize() {
var myLatlng = new google.maps.LatLng(46.94815, 7.4492);
var image = ‘img/googlemap-icon.png';

var mapOptions = {
center: myLatlng,
zoom: 16,
mapTypeId: google.maps.MapTypeId.ROADMAP
};

var map = new google.maps.Map(document.getElementById(“googlemap”),
mapOptions);
var styles = [
{
stylers: [
{ saturation: -255 },
{ “gamma”: 1 }
]
}
];

map.setOptions({styles: styles});
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
icon: image
});
}
google.maps.event.addDomListener(window, ‘load’, initialize);
</script>

 

<div id=” googlemap ” style=”width:100%;height:480px;”></div>

 

 

GEO Koordinaten auslesen:
http://universimmedia.pagesperso-orange.fr/geo/loc.htm

 Styleing Möglichkeiten Google:
https://developers.google.com/maps/documentation/javascript/styling?hl=de