Как убрать выделение вокруг карты google maps?

Ссылка скопирована
1 ответ

Всем привет. На сайте сделал карту google maps через JS методом:

this.map = new google.maps.Map(this.mapElement, {             center: {lat: 42, lng: -31},             zoom: 3,             maxZoom: 20,             minZoom: 3,             styles: MapStyleDark,             zoomControl: this.zoomControl,             zoomControlOptions: {                 position: google.maps.ControlPosition.LEFT_BOTTOM,             },             mapTypeControl: false,             streetViewControl: false,             fullscreenControl: false,             draggableCursor: 'default',             gestureHandling: 'greedy'         })

this.map = new google.maps.Map(this.mapElement, { center: {lat: 42, lng: -31}, zoom: 3, maxZoom: 20, minZoom: 3, styles: MapStyleDark, zoomControl: this.zoomControl, zoomControlOptions: { position: google.maps.ControlPosition.LEFT_BOTTOM, }, mapTypeControl: false, streetViewControl: false, fullscreenControl: false, draggableCursor: 'default', gestureHandling: 'greedy' })

Но при любом клике на карту, когда она вроде как в фокусе. Появляется вот такая обводка, которая создается выделенным на скриншоте div элементом. У него даже нет класса или ID чтобы как-тос крыть его через CSS. Как скрыть эту обводку?

Как убрать выделение вокруг карты google maps?

Дополнительно:

css

div[style*="border: 2px solid rgba(26, 115, 232)"] { border: none!important; }

div[style*="border: 2px solid rgba(26, 115, 232)"] { border: none!important; }

  • Спасибо, натолкнули на мысль сделал таким способом:
    #map .gm-style > div {     border: none!important; }

    #map .gm-style > div { border: none!important; }

Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Игорь Волков Ответ

Для того чтобы убрать выделение вокруг карты Google Maps, можно использовать CSS для изменения стилей. Во-первых, необходимо определить элемент, который отвечает за рамку вокруг карты. Обычно это элемент с классом .gm-style, который содержит в себе элементы div с классами .gm-style-iw и .gm-style-iw-c.

Пример CSS кода для удаления рамки вокруг карты:

.gm-style .gm-style-iw {
    border: none !important;
    box-shadow: none !important;
}

.gm-style .gm-style-iw { border: none !important; box-shadow: none !important; }

Этот CSS код уберет рамку и тень вокруг информационного окна на карте Google Maps.

Если вы хотите убрать рамку вокруг всей карты, то можете использовать следующий CSS код:

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

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

Этот код уберет рамку вокруг управляющих элементов карты Google Maps.

Помимо этого, также можно использовать JavaScript для управления стилями элементов карты. Например, чтобы убрать рамку у маркера на карте:

var marker = new google.maps.Marker({
    position: myLatLng,
    map: map,
    title: 'Hello World!',
    icon: {
        url: 'marker.png',
        scaledSize: new google.maps.Size(30, 30),
        anchor: new google.maps.Point(15, 15)
    },
    optimized: false
});

var marker = new google.maps.Marker({ position: myLatLng, map: map, title: 'Hello World!', icon: { url: 'marker.png', scaledSize: new google.maps.Size(30, 30), anchor: new google.maps.Point(15, 15) }, optimized: false });

В данном примере, опция optimized: false позволяет отключить оптимизацию маркера, что может убрать рамку вокруг него.

Надеюсь, эти советы помогут вам убрать выделение вокруг карты Google Maps!

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно