하나 이상의 "OneachFeature"전단지

Question

하나의 레이어에 두 개의 기능을 결합하려고하지만 동시에 직장에 올려 놓을 수는 없습니다.하나는 커서가 팝업에서 호버링하고 다른 사람이 팝업에서 정보를 가져 오는 것입니다.이 가이드를 사용했습니다. "Nofollow"> http://lofletjs.com/examples/COROPLESH.HTML (상호 작용 부분을 추가하고,이를 작업 정보 팝업 계층에 병합하려고 시도).또한 그 순간에 그것은 호버에 강조 표시되지만 클릭에 강조 표시되면 좋을 것입니다. 코드 :

    function style(feature) {
    return {
        fillColor: 'blue',
        weight: 2,
        opacity: 1,
        color: 'grey',
        dashArray: '3',
        fillOpacity: 0.7
    };
}

    L.geoJson(piirid, {style: style});

    function highlightFeature(e) {
        var layer = e.target;

        layer.setStyle({
            weight: 5,
            color: '#666',
            dashArray: '',
            fillOpacity: 0.7
        });

        if (!L.Browser.ie && !L.Browser.opera) {
            layer.bringToFront();
        }
    }

    function resetHighlight(e) {
        geojson.resetStyle(e.target);
    }

    var geojson;
    // ... our listeners
    geojson = L.geoJson(piirid);

    function zoomToFeature(e) {
        map.fitBounds(e.target.getBounds());
    }

    function onEachFeature3(feature, layer) {
        layer.on({
            mouseover: highlightFeature,
            mouseout: resetHighlight,
            //click: zoomToFeature
        });
    }

    geojson = L.geoJson(piirid, {
        style: style,
        onEachFeature: onEachFeature,
        onEachFeature: onEachFeature3
    });

    function onEachFeature(feature, layer) {
        if (feature.properties) {
            layer.bindPopup("<br><b><big><u>Aadresss: " + feature.properties.L_AADRESS + "</br></b></big></u><br> <b>Maakond:&nbsp;</b>" + feature.properties.MK_NIMI
            + " <br><br>", {"offset":  [200, -50]});
        }

}

.

감사합니다, 크리스털

Answer 1

두 가지 기능을 결합하여 동일한 매개 변수를 사용하여 하나의 함수로 보관 될 수 있습니다.

 function style(feature) {
        return {
            fillColor: 'blue',
            weight: 2,
            opacity: 1,
            color: 'grey',
            dashArray: '3',
            fillOpacity: 0.7
        };
    }

    L.geoJson(piirid, {style: style});

    function highlightFeature(e) {
        var layer = e.target;

        layer.setStyle({
            weight: 5,
            color: '#666',
            dashArray: '',
            fillOpacity: 0.7
        });

        if (!L.Browser.ie && !L.Browser.opera) {
            layer.bringToFront();
        }
    }

    function resetHighlight(e) {
        geojson.resetStyle(e.target);
    }

    var geojson;
    // ... our listeners
    geojson = L.geoJson(piirid);

    function zoomToFeature(e) {
        map.fitBounds(e.target.getBounds());
    }

    function onEachFeature3(feature, layer) {
        layer.on({
            mouseover: highlightFeature,
            mouseout: resetHighlight,
            //click: zoomToFeature
        });
        if (feature.properties) {
            layer.bindPopup("<br><b><big><u>Aadresss: " + feature.properties.L_AADRESS + "</br></b></big></u><br> <b>Maakond:&nbsp;</b>" + feature.properties.MK_NIMI
            + " <br><br>", {"offset":  [200, -50]});
        }
    }

    geojson = L.geoJson(piirid, {
        style: style,
        onEachFeature: onEachFeature3
    });

.