Skip to main content

Uploading GPX file to website and displaying it visually

I'd like to create a file upload button and then print the resulting gpx file on the map, could anyone have a look at this code to see where I'm going wrong?

body:

<form action="/action_page.php"> Select a file: <input type="file" id="uploadID"><br><br> <input type="submit"> 

js:

let gpx = document.getElementById('uploadID'); gpx.onchange = function() { new L.GPX(gpx, { async: true, marker_options: { startIconUrl: 'pin-icon-start.png', endIconUrl: 'pin-icon-end.png', shadowUrl: 'pin-shadow.png' } }).on('loaded', function(e) { map.fitBounds(e.target.getBounds()); }).addTo(map); }