Встраивание Google Maps — Удалить карточку места

Я использую новый код встраивания карт Google (iFrame), чтобы добавить небольшую карту на свой веб-сайт, но я не могу скрыть поле нового адреса в верхнем левом углу (см. изображение ниже).

http://i.imgur.com/JOVXkra.jpg

Я сгенерировал код карты, щелкнув опцию «Поделиться и встроить карту» (см. изображение ниже), но мне интересно, нужно ли мне использовать полный API для достижения этой цели.

http://i.imgur.com/xxl25Ga.png

Все ресурсы, которые я нашел до сих пор, просто обсуждают старую версию встраивания и отключение информационного выноски, которое не то же самое, и единственная подсказка, которую я получил, это то, что класс HTML коробки называется «карточка места» но поиск по-прежнему ничего мне не приносит.

Любая помощь или точка в правильном направлении будут высоко оценены.


google-maps iframe hide google-maps-embed
person Sintyche    schedule 19.12.2013    source источник
comment
Вот более подробное обсуждение: stackoverflow.com/questions/11334042/< /а>   -  person harvest316    schedule 09.04.2014
comment
Очень поздно, но вот еще один способ удалить его. stackoverflow.com/a/37083353/3130549   -  person rawnewdlz    schedule 09.01.2017
comment
Это здорово, спасибо. Если вы добавите тот же ответ здесь, я приму его как правильный ответ.   -  person Sintyche    schedule 10.01.2017

Ответы (3)


arrow_upward
34
arrow_downward

Вы можете скрыть все кнопки с помощью css. Создайте переполнение ширины контейнера div для скрытых и нужных вам размеров. Поместите внутрь новый iframe/embed карт Google Maps большего размера. Чтобы расположить карты iframe, используйте отрицательные поля.

Пример со 100% шириной:

<div style="width: 100%; overflow: hidden; height: 300px;">
  <iframe 
     src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d39797.07748547086!2d5.46683904751879!3d51.433965676849986!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c6d90575ca5e3d%3A0x55989f5f344b006!2sPrins+Hendrikstraat+5!5e0!3m2!1snl!2snl!4v1392716144537"
     width="100%"
     height="600"
     frameborder="0"
     style="border:0; margin-top: -150px;">
  </iframe>
</div>

Сделайте iframe на 300 пикселей выше, чем ваш контейнер div. 150px, чтобы скрыть внизу и 150px, чтобы скрыть сверху. Чтобы скрыть это 150 в верхней части iframe, используйте:

верхнее поле: -150px;

person Bo Pennings    schedule 18.02.2014
comment
Кажется довольно хакерским, но довольно умным. +1 - person Howdy_McGee; 21.03.2014
comment
Как вы думаете, это может быть расценено как нарушение условий Google? я спрашиваю это, потому что, если вы сделаете то же самое, чтобы скрыть строку авторского права внизу, у вас могут быть проблемы. - person Thiago Duarte; 26.01.2015
comment
Я не об этом спрашивал, мне просто интересно, не может ли скрытие кнопок вверху рассматриваться как нарушение прав, как это происходит, когда вы скрываете строку с авторскими правами. - person Thiago Duarte; 28.01.2015
comment
Проблема в том, что он также скрывает элементы управления масштабированием. - person coneybeare; 29.01.2015
comment
@coneybeare, вы можете сохранить элементы управления масштабированием, если измените стиль CSS. Установите отрицательное значение поля слева (я думаю, -100px) и высоту ниже. - person Bo Pennings; 30.01.2015
comment
Верно, но тогда вы теряете любую центрированную булавку из-за того, что она появляется в центре. - person coneybeare; 30.01.2015
comment
@coneybeare, вы можете изменить центральную точку в URL-адресе Google при создании iframe. - person Bo Pennings; 21.12.2015
comment
@BoPennings Нет. Выполнение корректировки карты долготы и широты с учетом размера пикселя и уровня масштабирования в лучшем случае кошмарно. Вообще не верное решение. - person coneybeare; 22.12.2015
comment
Идеальная и умная логика. Большой палец вверх для вас! - person Ahsan Khan; 27.12.2019
comment
Это сработало для меня в 2021 году. Спасибо. - person Sha; 07.01.2021

arrow_upward
0
arrow_downward

Вы можете удалить метки и элементы управления картой (значки типа карты и масштабирования).

<div style="width: 100%; overflow: hidden; height: 350px;">
    <iframe width="100%" height="600" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"  style="border:0; margin-top: -150px;"  src="https://maps.google.com/maps?f=l&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Walt+Disney+World+Resort&amp;aq=t&amp;sll=28.38545007745952, -81.56377744291994&amp;ie=UTF8&amp;ll=28.38545007745952, -81.56377744291994&amp;z=17&amp;om=0&amp;iwloc=addr&amp;iwd=0&amp;layer=0&amp;output=embed"></iframe></small>
    </div>

Примечание: вы можете добавлять/удалять параметры, если хотите

https://moz.com/ugc/everything-you-never-wanted-to-know-about-google-maps-parameters

person Zafar Ahmed    schedule 28.10.2020

arrow_upward
-1
arrow_downward

вы можете попробовать это:

  1. Перейдите на страницу https://www.maps.ie/coordinates.html, чтобы получить свои координаты.
  2. Перейдите на Google Maps и введите эти координаты (через запятую: 33.319663, -111.89780100000002)
  3. Нажмите «Поделиться» (расположен слева).
  4. Нажмите на вставить карту
  5. Настройте размер карты, который вы хотите
  6. Скопируйте html

Ваш iframe будет примерно таким:

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3333.967410377096!2d-111.89998968453055!3d33.31966746342457!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x0!2zMzPCsDE5JzEwLjgiTiAxMTHCsDUzJzUyLjEiVw!5e0!3m2!1sen!2sus!4v1516690469899" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
person Alvin    schedule 19.05.2019