1

I have a map which loads a GeoJSON containing two features (lines). I would like to use Leaflet Elevation plugin to display an elevation profile for each of those lines. The problem with my code is that when I click a feature, there is no data added to the elevation profile.

var map = L.map('map').setView([44.635, 22.653], 11);
var osm = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);

function addData(e) {
    var el = L.control.elevation();
    el.addData(e);
    map.addControl(el);
}

function onEachFeature(feature, layer) {
    layer.on({
    click: addData
    });
}

var trails = new L.GeoJSON.AJAX('https://googledrive.com/host/0B55_4P6vMjhITEU4Ym9iVG8yZUU/map.geojson', {
onEachFeature: onEachFeature
}).addTo(map);

Here's a JSFiddle of my work: http://jsfiddle.net/pufanalexandru/eaok0Lnz/3/

2

It seems like the feature data was not passed to the addData function.

If I change this

function onEachFeature(feature, layer) {
    layer.on({
    click: addData
    });
}

to this

function onEachFeature(feature, layer) {
    layer.on ('click', function(e) {
        addData(feature)
    });
}

then it works. I changed the onclick notation a bit (following this example in the docs), because otherwise it would already show the elevation profiles on load instead of on click.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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