-1

Whenever a marker is clicked on the map I need to show data of that marker in a div which outside of the map.

I am trying with Html Dom element.

map.on('click', 'places', function (e) {
            var coordinates = e.features[0].geometry.coordinates.slice();
            var title = e.features[0].properties.title;
            var description = e.features[0].properties.description;

            while (Math.abs(e.lngLat.lng - coordinates[0]) > 180) {
                coordinates[0] += e.lngLat.lng > coordinates[0] ? 360 : -360;
            }


            var content = '<div><strong>' + feature.properties.title + '</strong>' +
                '<p>' + feature.properties.description + '</p></div>';

            info.innerHTML = content;

        });

This where I need to show information in a table.

 <div class="info" id="info" style="color: whitesmoke">


        </div>

This is the map div

<div id="map">

    </div>

1 Answers1

2

Replace this line:

info.innerHTML = content;

with this line:

document.getElementById('info').innerHTML = content;

Devashish
  • 1,260
  • 1
  • 10
  • 21