6

I want to hyperlink from onclick of a polygon to new tab based on 'link' field in polygon json. When user clicks on polygon, a new browser tab is opened pointing to URL value of that polygon.

I am using the Leaflet Chloropleth demo map, edited for my own geojson data.

I need guidance on referencing the 'link' field in the geojson to the open url function. Whereas now onclick creates new empty browser tab.

        var geojson;

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

    function onclick(e) {
        window.open(this.options.win_url);
    }


    function onEachFeature(feature, layer) {
        layer.on({
            mouseover: highlightFeature,
            mouseout: resetHighlight,
            click: onclick
        });
    }

    geojson = L.geoJson(states, {
        style: style,
        onEachFeature: onEachFeature
    }).addTo(map);
1
  • 1
    Could you please clarify the desired behaviour? What should happen when the user clicks on a polygon? I'm not sure what directly hyperlink to new tab means in this context. Commented Jan 27, 2016 at 0:27

1 Answer 1

6

Do you have "win_url" saved as a property on each feature in states geojson?

If so, try:

function onclick(e) {
    window.open(e.target.feature.properties.win_url);
}
2
  • toms - perfect. I see how the feature.properties was missing. Thanks so much!
    – AmyK1478
    Commented Jan 27, 2016 at 1:06
  • you are most welcome
    – toms
    Commented Jan 27, 2016 at 1:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.