I have a simple Leaflet map and would like to add a GPX file coming from a Garmin device. I use omnivore plugin and by default it gets a line. How could I represent points in each coordinate instead of a line?

var map = L.map('map').setView([41.39742, 2.16328], 13);

L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
        maxZoom: 25,
        attribution:'Map data &copy; <ahref="http://openstreetmap.org">OpenStreetMap'

var gpxURL = './gpx/Track_PESCA1-19 071255.gpx';
var gpx = omnivore.gpx(gpxURL).addTo(map);

1 Answer 1


I use omnivore plugin and by default it gets a line.

LineString is the only thing it can produce (see https://github.com/mapbox/togeojson#gpx-feature-support, omnivore is built upon togeojson), but no one prevents you from creating your own layer utilizing Custom Layers and L.geoJson onEachFeature option in the following way:

var pointFeatures = [];

var customLayer = L.geoJson(null, {
    onEachFeature: function (feature, layer) {
        feature.geometry.coordinates.forEach(c => pointFeatures.push({
            "type": "Feature",
            "geometry": {
                "type": "Point",
                "coordinates": [c[0], c[1]]

var runLayer = omnivore.gpx('run.gpx', null, customLayer)
    .on('ready', function() {
        var geojson = {
            "type": "FeatureCollection",
            "features": pointFeatures

Here is a working demo for which I reworked this example: http://anatolysukhanov.com/stackoverflow/leaflet/omnivore.html


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.