Как убрать выделение вокруг карты google maps?
Всем привет. На сайте сделал карту 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. Как скрыть эту обводку?
Дополнительно:
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; }
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос

Для того чтобы убрать выделение вокруг карты 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; }
Этот CSS код уберет рамку и тень вокруг информационного окна на карте Google Maps.
Если вы хотите убрать рамку вокруг всей карты, то можете использовать следующий CSS код:
.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 });
В данном примере, опция optimized: false позволяет отключить оптимизацию маркера, что может убрать рамку вокруг него.
Надеюсь, эти советы помогут вам убрать выделение вокруг карты Google Maps!