4

JavaScript 内にラップされた geojson と組み合わせてポップアップをいじり、bindpopup フロントで何をする必要があるかをマスターしました。ここで、ポップアップをマーカーから効果的にバインド解除し、ポップアップをサイド パネルまたは独自の div のマップの下に表示したいと考えています。

これは現在のポップアップのコードです。コードを layer.bindPopup(popupContent) の周りで変更し、それを独自の div に参照する必要があると思いますか? 

    <script>
    var map = L.map('map').setView([51.4946, -0.7235], 11)
    var basemap =
    L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
        attribution: 'OSM data',
    }).addTo(map);

    function onEachFeature(feature, layer) {
        var popupContent = "<b>" + feature.properties.ward_names +
                " </b><br>Population 2011 = <b>" + feature.properties.census_11 + 
                " </b><br>Population 2001 = <b>"+ feature.properties.census_01 +
                " </b><br>You can find out more about population data on the <a href='http://www.somewhere.com' target='_blank'>somewhere.com</a> website ";

        if (feature.properties && feature.properties.popupContent) {

            popupContent += feature.properties;
        }

        layer.bindPopup(popupContent);

    }
    L.geoJson([wardData], {
        style:  function (feature) {
            return { weight: 1.5, color: "#000000", opacity: 1, fillOpacity: 0 };
            return feature.properties;
        },
        onEachFeature: onEachFeature,
    }).addTo(map);
</script>

ただし、これを行う方法がよくわからず、ガイダンスが必要です。

乾杯

シ

4

2 に答える 2

1

L.Control クラスは、目的に適したツールです。

このチュートリアルに従うことをお勧めします。これにより、何ができるかをすばやく理解できます。

于 2013-06-15T13:08:32.083 に答える