it-swarm.com.de

Wie können Sie das Google-Logo, die Fußzeile und das Copyright für Google Maps JavaScript API v3 ausblenden oder deaktivieren?

Ich habe diese Aufgabe bei der Arbeit, bei der ich die Google Maps API v3 verwenden muss, und das Design, das sie mir gaben, war ohne das Logo/die Fußzeile/das Urheberrecht, das Google in den unteren Teil der Karte einfügt. Nun, ich muss es deaktiviert oder ausgeblendet haben, weil mir gesagt wurde, dass ich das genaue Design anpassen muss, egal was passiert.

Ich musste betonen, dass ich damit gegen die Nutzungsbedingungen von Google verstoße.

9.4 Namensnennung. 

(a) Inhalte, die Ihnen über den Service bereitgestellt werden, können Handelsnamen, Marken, Dienstleistungsmarken, Logos, Domainnamen und andere charakteristische Markenmerkmale von Google, seiner Partner oder anderer Rechteinhaber für von Google indizierte Inhalte enthalten. Wenn Google diese Zuordnung bereitstellt, müssen Sie sie so anzeigen, wie sie durch den Service bereitgestellt wird oder wie in der Google Maps APIs-Dokumentation beschrieben. Diese Markennamen, Marken, Dienstleistungsmarken, Logos, Domänennamen und andere unverwechselbare Marken dürfen nicht gelöscht oder auf irgendeine Weise verändert werden Eigenschaften. https://developers.google.com/maps/terms

Nun, bei meiner Arbeit kümmerten sie sich nicht darum und sie sagten mir immer, ich solle es trotzdem tun, also mache ich das so.

In der CSS habe ich die folgenden Codezeilen hinzugefügt:

#map-report div.gmnoprint,
#map-report div.gmnoscreen {
    display: none;      
}

img[src="http://maps.gstatic.com/mapfiles/google_white.png"] {
    display: none; 
}
44
mkhuete

Dieses CSS funktioniert wie ein Charme [März 2018 getestet]. 
Entfernt Google Logo , Nutzungsbedingungen und Problem melden div.


a[href^="http://maps.google.com/maps"]{display:none !important}
a[href^="https://maps.google.com/maps"]{display:none !important}

.gmnoprint a, .gmnoprint span, .gm-style-cc {
    display:none;
}
.gmnoprint div {
    background:none !important;
}
105
Abhishek Goel

Versuchen Sie dies für api v3:

.gm-style-cc { display:none; }

19
Luis A. Florit

Update vom Januar 2018 . Lässt nur eine saubere Karte:

a[href^="http://maps.google.com/maps"],
a[href^="https://maps.google.com/maps"],
a[href^="https://www.google.com/maps"] {
    display: none !important;
}
.gm-bundled-control .gmnoprint {
    display: block;
}
.gmnoprint:not(.gm-bundled-control) {
    display: none;
}

Ab Februar 2018 macht das CSS oben Markierungen auf der Karte unklickbar . Wenn Sie keine Marker haben, sollten Sie keine Probleme haben, aber wenn Sie nur die letzte CSS-Regel .gmnoprint:not(.gm-bundled-control) entfernen, werden die Marker anklickbar, es werden jedoch einige Copyright- und Nutzungsbedingungen-Labels angezeigt

11
Quinn Daley

Wie Sie bereits erwähnt haben, ist das Entfernen des Google-Logos und der Copyright-Hinweise nicht mit den Google Maps APIs-Nutzungsbedingungen, insbesondere mit Absatz 9.4, kompatibel: 

"Inhalte, die Ihnen über den Service bereitgestellt werden, enthalten möglicherweise die Markenmerkmale von Google, seine strategischen Partner oder andere Rechteinhaber, deren Inhalte von Google indexiert werden.) Wenn Google diese Markenmerkmale oder andere Attribute über den Service zur Verfügung stellt, können Sie muss eine solche Zuordnung wie angegeben (oder wie in der Google Maps APIs-Dokumentation beschrieben) anzeigen und darf die Zuordnung nicht löschen oder ändern. "

Um den Nutzungsbedingungen zu entsprechen, stellen Sie bitte sicher, dass das Google-Logo und die Copyright-Hinweise sichtbar sind.

6
kaskader

Sie können es nicht aus der API entfernen. Sie können jedoch ein Div verwenden, das Sie in den Copyright-Hinweis einfügen können

<div style="width:100px; height:15px; position:absolute; margin-left:100px margin-

bottom:50px; background-color:white;">
</div>

Ändern Sie die Höhe, Breite und Ränder je nach Bedarf.

5

Funktioniert wie ein Zauber mit v3:

.gm-style-cc {
  display: none !important;
}

.gm-style a[href^="https://maps.google.com/maps"] {
  display: none !important;
}

Nehmen Sie eine Notiz für den zweiten Selektor, den ich .gm-style vor a verwende, da andernfalls all Links zu https://maps.google.com/maps nicht nur von Google Map selbst ausgeblendet werden.

5
Lukas

Du kannst das: 

#map-report a img { display:none; } 
4
Guillaume

Sie können den Klick auf google copyright.so verhindern, dass sich der Benutzer nicht aus Ihrer Anwendung entfernen kann.

google.maps.event.addListenerOnce(map, 'idle', function(){
    // do something only the first time the map is loaded
    //@mapCopyright - gets the google copyright tags
    var mapCopyright=document.getElementById('map-canvas').getElementsByTagName("a");   
        $(mapCopyright).click(function(){
            return false;
        });
    });
3
Yuvaraj

Legen Sie zuerst Ihre Karten in einen Container:

<div id="map">
    <div class="google-maps"></div>
</div>

CSS:

#map {
    position: relative;
    height: 500px;
    overflow: hidden; //important
}
#map .google-maps {
    position: absolute;
    width: 100%;
    height: 110%;  //that will do the trick
    left: 0;
    top: 0;
}
2
curved

verwenden Sie diesen Code (css)

a[href^="http://maps.google.com/maps"]{display:none !important}
1

Durch die Verbesserung einer anderen Lösung werden hier nur die Links in der Karte deaktiviert, sodass die Leute die App nicht verlassen (und sich nicht verhaken können). Auf einer App macht es einen großen Unterschied, wenn Leute versuchen, eine kleine Karte zu scrollen und versehentlich zu tippen.

  google.maps.event.addListenerOnce(map, 'idle', function(){

      $("#map a").click(function(){
          return false;
      });
  });
1
eyal_katz

diese:

#map-repor > div { 
  height: 105% !important;
}

reicht in meinem fall

1
Picard

Dies funktioniert vorerst zumindest solange, bis das Titelattribut für den Link um das Logo geändert wird.

.gm-style a[title='Click to see this area on Google Maps']{ display: none!important; }
0
jdbosley

Das wird den Trick tun.

$('#map span:contains("©")')
    .closest('.gmnoprint')
    .css('opacity', '0')
0
  .gm-style-mtc,
  .gm-svpc,
  .gm-style-cc {
    display: none;
  }

ich denke, Sie sollten einen Wrapper-Block hinzufügen, um den neuen Stil zu ändern! und mit Google-Logo in der linken Fußzeile. Sie können inspect element verwenden, um unseren Selektor hier gleich abzurufen.

#example-map > div > div > div:nth-child(3) {
  display: none;
}
0

Einzeiler, die mit V3 arbeiten

CSS

#map .gm-style > div:not(:first-child) { display: none; }

jQuery

$('#map .gm-style > div:not(:first-child)').remove()
0
user1025495
.gm-style > div:first-child {
z-index: 10000000 !important;
}

z-index: 1000000 wird von js für alle divs hinzugefügt, aber wir möchten nur die Karte sehen, daher müssen wir z-index auf 10000000 setzen

0
adamrosloniec