Всегда показывать всплывающие окна - PullRequest
Новая
       37

Всегда показывать всплывающие окна

0 голосов
/ 17 мая 2019

Я следовал этому уроку https://docs.mapbox.com/help/tutorials/custom-markers-gl-js/

Мои маркеры отображаются нормально, и я могу нажимать на маркеры, чтобы показать всплывающее окно, но я бы хотел, чтобы всплывающие окна всегда отображались.

Я успешно изменил CSS, чтобы не отображать стрелку и кнопку «x / close». 

var geojson = {
    "type": "FeatureCollection",
    "features": [{
         "type": "Feature",
         "geometry": {
             "type": "Point",
             "coordinates": [-77.032, 38.913]
         },
         "properties": {
             "title": "Mapbox",
             "description": "Washington, D.C."
         }
     },
     {
         "type": "Feature",
         "geometry": {
         "type": "Point",
         "coordinates": [-122.414, 37.776]
        },
         "properties": {
             "title": "Mapbox",
             "description": "San Francisco, California"
         }
     }]
};

var map = new mapboxgl.Map({
    container: 'map',
    style: 'mapbox://styles/mapbox/light-v10',
    center: [-96, 37.8],
    zoom: 3
});

// add markers to map
geojson.features.forEach(function(marker) {

    // create a HTML element for each feature
    var el = document.createElement('div');
    el.className = 'marker';

    // make a marker for each feature and add it to the map
    new mapboxgl.Marker(el)
        .setLngLat(marker.geometry.coordinates)
        .setPopup(new mapboxgl.Popup({offset: 25}) // add popups
            .setHTML('<h3>' + marker.properties.title + '</h3><p>' + marker.properties.description + '</p>'))
        .addTo(map);
});

Есть идеи?

1 Ответ

2 голосов
/ 17 мая 2019

Я успешно изменил CSS, чтобы не показывать стрелку и кнопку «x / close»

Чтобы скрыть кнопку «x», вы также можете использовать опцию closeButton (см. Справочник по API ).

но я бы хотел, чтобы всплывающие окна всегда отображались.

Используйте togglePopup () , который «открывает или закрывает всплывающее окно в зависимости от текущего состояния»: 

new mapboxgl.Marker(el)
    .setLngLat(marker.geometry.coordinates)
    .setPopup(new mapboxgl.Popup({closeOnClick: false, closeButton: false}).setText("some text"))
    .addTo(map)
    .togglePopup();
...