У меня есть это задание на работе, в котором мне нужно использовать API карт Google v3, и дизайн, который они мне дали, был без логотипа/нижнего колонтитула/авторского права, которое google помещает в нижнюю часть карты. Ну, мне нужно, чтобы он был отключен или скрыт, потому что мне сказали, что мне нужно соответствовать точному дизайну, несмотря ни на что.
Я должен был подчеркнуть, что, выполняя это, я нарушаю условия использования сервиса Google...
9.4. Атрибуция.
(a) Содержимое, предоставленное вам через Службу, может содержать торговые наименования, товарные знаки, знаки обслуживания, логотипы, имена доменов и другие отличительные особенности бренда Google, ее партнеров или других сторонних правообладателей контента, индексированных Google. Когда Google предоставляет эту атрибуцию, вы должны отображать ее в соответствии с предоставленной службой или как описано в Документах по API Карт и не может удалять или каким-либо образом изменять эти торговые названия, товарные знаки, знаки обслуживания, логотипы, имена доменов и другую отличительную марку функции. https://developers.google.com/maps/terms
Хорошо, что в моей работе они не заботились об этом, и они всегда говорили мне делать это в любом случае, так вот как я это делаю.
В css я добавил следующие строки кода:
#map-report div.gmnoprint,
#map-report div.gmnoscreen {
display: none;
}
img[src="http://maps.gstatic.com/mapfiles/google_white.png"] {
display: none;
}
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;
}
Попробуйте это для api v3:
.gm-style-cc { display:none; }
Январь 2018 обновление. Оставляет только чистую карту:
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;
}
По состоянию на февраль 2018 года CSS выше делает маркеры на карте не кликабельными. Если у вас нет маркеров, у вас не должно быть проблем, но если вы просто удалите последнее правило CSS .gmnoprint:not(.gm-bundled-control), маркеры станут кликабельными, но их будет немного авторские права и условия использования этикетки
Как вы упомянули, удаление логотипа Google и уведомлений об авторских правах не соответствует API-интерфейсам API Карт Google, в частности с пунктом 9.4:
"Контент, предоставляемый вам через Службу, может содержать фирменные функции Google, ее стратегических партнеров или других сторонних правообладателей контента, которые индексируются Google. Когда Google предоставляет эти Брэнд-характеристики или другие атрибуты через Сервис, вы должен отображать такую атрибуцию, которая предоставляется (или, как описано в Документах API Карт), и не должна удалять или изменять атрибуцию.".
Чтобы быть в соответствии с Условиями обслуживания, обязательно удостоверьтесь, что логотип Google и уведомления об авторских правах видны.
Вы не можете удалить его из API. Но вы можете использовать div, который вы можете разместить в уведомлении об авторских правах
<div style="width:100px; height:15px; position:absolute; margin-left:100px margin-
bottom:50px; background-color:white;">
</div>
выполните изменения высоты, ширины и полей в зависимости от потребности.
Работает как шарм с v3:
.gm-style-cc {
display: none !important;
}
.gm-style a[href^="https://maps.google.com/maps"] {
display: none !important;
}
Возьмите примечание для второго селектора. Я использую .gm-style до a, потому что иначе он будет скрывать все ссылки на https://maps.google.com/maps не только от самой карты Google.
Вы можете сделать это:
#map-report a img { display:none; }
Вы можете предотвратить щелчок на google copyright.so, что он не позволит пользователю выйти из вашего приложения. Надеемся, что это решит вашу проблему.
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;
});
});
Сначала поместите свои карты в контейнер:
<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;
}
используйте этот код (css)
a[href^="http://maps.google.com/maps"]{display:none !important}
Улучшая другое решение здесь, это просто отключает ссылки на карте, поэтому люди не покидают приложение (и застревают без возможности вернуться). В приложении это имеет большое значение, когда люди пытаются прокрутить небольшую карту и нажмите по ошибке.
google.maps.event.addListenerOnce(map, 'idle', function(){
$("#map a").click(function(){
return false;
});
});
#map-repor > div {
height: 105% !important;
}
достаточно в моем случае
Это сделает трюк.
$('#map span:contains("©")')
.closest('.gmnoprint')
.css('opacity', '0')
Это работает пока, по крайней мере, до тех пор, пока они не изменят атрибут title для ссылки вокруг логотипа.
.gm-style a[title='Click to see this area on Google Maps']{ display: none!important; }
.gm-style > div:first-child {
z-index: 10000000 !important;
}
z-index: 1000000 добавляется js для всех div, но мы хотим видеть только карту, поэтому мы должны установить z-index на 10000000
#map .gm-style > div:not(:first-child) { display: none; }
$('#map .gm-style > div:not(:first-child)').remove()
.gm-style-mtc,
.gm-svpc,
.gm-style-cc {
display: none;
}
я думаю, что вы должны добавить блок-обертку, чтобы изменить новый стиль! и с логотипом Google в левом нижнем колонтитуле. Вы можете использовать inspect element, чтобы получить наш селектор такой же здесь.
#example-map > div > div > div:nth-child(3) {
display: none;
}