Google Maps auf kommerzieller Website einbinden

[dn3d_fanboy]

Hallo,
leider werde ich zum Thema "Google Maps auf eigener Website einbinden" nicht so richtig schlau.

Momentan binde ich die Google Maps über einen Javascript-Code ein, den ich in einem der vielen Online-Generatoren generiert habe. Darf ich das überhaupt?

Code:

<div id="gmaps-area">
                <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
                <div style="overflow:hidden;height:400px;width:400px;"><div id="gmap_canvas" style="height:400px;width:400px;"></div>
                <style>#gmap_canvas img{max-width:none!important;background:none!important;}</style></div>
                <script type="text/javascript"> function init_map(){var myOptions = {zoom:16,center:new google.maps.LatLng(50.77436,7.475289999999973),mapTypeId: google.maps.MapTypeId.ROADMAP};map = new google.maps.Map(document.getElementById("gmap_canvas"), myOptions);marker = new google.maps.Marker({map: map,position: new google.maps.LatLng(50.77436, 7.475289999999973)});infowindow = new google.maps.InfoWindow({content:"<b>Kindergarten Haus Kunterbunt</b><br/>Halfter Stra&szlig;e 41<br/>53783 Eitorf" });google.maps.event.addListener(marker, "click", function(){infowindow.open(map,marker);});infowindow.open(map,marker);}google.maps.event.addDomListener(window, 'load', init_map);</script>
        </div>

Oder wie muss ich da vorgehen. Über die Googl-eigene API? Ist das dann auch kostenlos bei kommerzellen Websites (die Map wäre natürlich frei zugänglich)?

Leider finde ich im Web teils sehr widersprüchliche und (wahrscheinlich) veraltete Aussagen. Vielleicht kann mir hier jemand den ein oder anderen Tipp geben, wie ich bei dem Thema vorgehen darf.

Besten Dank im Voraus.

 

[fth]

Die sichersten Antworten findest du wohl bei google selbst ...
http://www.google.de/permissions/geoguidelines.html

 

[msa1989]

Hi,

hier ist ein Code wie man eine Google Maps Karte einbinden kann:

<div id="map-canvas" style="width:500px; height:500px;"></div>
<script type="text/javascript">
function initialize() {
    var Pos1 = new google.maps.LatLng(48.798242, 11.080871);
    var Pos2 = new google.maps.LatLng(48.780005, 11.115932);
    var msg1 = '<p>Mein Content</p>';
    var msg2 = '<p>Mein Content</p>';
    var Marker1 = 'https://chart.googleapis.com/chart?chst=d_map_xpin_letter&chld=pin|+|00FFFF|000000|FF0000';
    var Marker2 = 'https://chart.googleapis.com/chart?chst=d_map_xpin_letter&chld=pin|+|CDCDCD|000000|DEDEDE';
    var mapOptions = {
        zoom: 13,
    center: new google.maps.LatLng(48.789902, 11.091299)
  };
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
    placeMarker(Pos1, msg1, Marker1, map);
    placeMarker(Pos2, msg2, Marker2, map);
   
}

function placeMarker(LatLngPos, msg, customMarker, map) {
    var infoWindow = new google.maps.InfoWindow();
    var marker = new google.maps.Marker({
        position: LatLngPos,
        map: map,
        icon: customMarker
    });
    google.maps.event.addListener(marker, 'click', function(event) {
        infoWindow.setContent('<div style="width:350px">' + msg + '</div>');
        infoWindow.setPosition(event.latLng);
        infoWindow.open(map);
        map.setCenter(marker.getPosition());
        map.setZoom(15);
    });
}

function loadScript() {
    var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&callback=initialize';
  document.body.appendChild(script);
}

window.onload = loadScript;
</script>

lies es dir durch, schau in die Google Maps Dokumentation. Unterliegt natürlich den Beschränkungen von Google. Kopier den Code einfach mal in eine HTML-Vorlage und schau dir die Live-Version an.

 

[patrick_l]

Oder wie muss ich da vorgehen. Über die Googl-eigene API? Ist das dann auch kostenlos bei kommerzellen Websites (die Map wäre natürlich frei zugänglich)?

Kurz und knapp: Ja, darfst du. Jedoch würde ich keinen Generator nehmen, da diese in der Regel irgendwelche "Brandings" (Backlinks) enthalten. Auch wirkt die Karte von Google vereinzelt als Fremdkörper. Daher mit der API arbeiten, und das Kartenmaterial an das eigene Layout anpassen.

Liebe Grüße, Patrick

 

[Balthazar]

das hat mir auch geholfen...Danke