Examples of usage Leaflet library
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
css
gpx
lib
output
src
.gitignore
README.md
_bootstrap.php
example_01.html
example_02.html
example_03.php
example_04.php
example_05.html
example_05.php
example_06.html
example_07.html
example_07.js
example_07.php
example_08.html
example_08.php
index.html
package.json

README.md

Leaflet Examples

leaflet-example

Examples of usage Leaflet library. Based on http://velocrunch.ru project. Related post: http://antonshell.me/post/leaflet-examples-part1

Live demo: http://demo.antonshell.me/leaflet_examples/

Main features: Implemented examples for map rendering, gpx tracks, performance optimization for large gpx files, markers rendering, track points rendering.

Extra features: combine(concatenate) gpx tracks, get bounds from gpx, convert gpx to geojson format. Convert Garmin gpx track points to json array.

Leaflet is a JavaScript library for mobile-friendly interactive maps. https://github.com/Leaflet/Leaflet

Install

1 . Clone repository

git clone https://github.com/antonshell/leaflet_examples.git

2 . Install dependencies

npm install

3 . Prepare geojson

php example_05.php
php example_07.php
php example_08.php

4 . Open in browser

http://127.0.0.1/leaflet_examples/

PHP 7.* is required.

Examples

1 . Map + Single GPX tracks

demo: example_01.html

2 . Map + multiple GPX tracks(simple)

demo: example_02.html

3 . Get bounds for GPX tracks

php example_03.php

Results:

Array
(
    [neLat] => 36.79923084564507
    [neLng] => 21.265787724405527
    [swLat] => 38.496870584785938
    [swLng] => 24.058144837617874
)

4 . Get bounds for multiple GPX tracks.

php example_04.php

Results:

Array
(
    [0] => /Users/antonshell/Projects/leaflet_examples/gpx/austria-2016/full.gpx
    [1] => /Users/antonshell/Projects/leaflet_examples/gpx/greece-2018/full.gpx
    [2] => /Users/antonshell/Projects/leaflet_examples/gpx/italy-coast-to-coast-2017/full.gpx
    [3] => /Users/antonshell/Projects/leaflet_examples/gpx/italy-dolomity-2017/full-2016.gpx
    [4] => /Users/antonshell/Projects/leaflet_examples/gpx/italy-dolomity-2017/full-2017.gpx
    [5] => /Users/antonshell/Projects/leaflet_examples/gpx/italy-dolomity-2017/laguna.gpx
    [6] => /Users/antonshell/Projects/leaflet_examples/gpx/sardegna-2017/full.gpx
)
Array
(
    [neLat] => 36.79923084564507
    [neLng] => 8.3107243851
    [swLat] => 47.807752154767513
    [swLng] => 24.058144837617874
)

5 . Combine GPX tracks

php example_05.php

demo: example_05.html

6 . Markers

demo: example_06.html

7 . Map + multiple GPX tracks(optimized)

php example_07.php

demo: example_07.html

8 . Track Points(Garmin)

php example_08.php

demo: example_08.html