|
|
(14 intermediate revisions by 3 users not shown) |
Line 1: |
Line 1: |
| [[Displaying Leaflet Maps|Leaflet maps]] can be [[Customizing Leaflet Maps|customized using various parameters]]. | | [[Displaying Leaflet Maps|Leaflet maps]] can be [[Customizing Leaflet Maps|customized using various parameters]]. |
|
| |
|
| This page lists examples. For an overview of available parameters and how to use them, see [[[[Customizing Leaflet Maps]]. | | This page lists examples. For an overview of available parameters and how to use them, see [[Customizing Leaflet Maps]]. |
| | |
| | == Markers, Polygons, Lines, etc == |
| | |
| | See [[Displaying Leaflet maps]] |
|
| |
|
| == Layers == | | == Layers == |
Line 19: |
Line 23: |
| |zoom=1 | | |zoom=1 |
| }} | | }} |
| | |
| | '''Note:''' [https://github.com/JeroenDeDauw/Maps/blob/master/DefaultSettings.php#L163-L226 Maps code repository â List of available layers.] |
|
| |
|
| == Overlays == | | == Overlays == |
Line 85: |
Line 91: |
|
| |
|
| <pre> | | <pre> |
| {{#display_map:image layers=NewYorkSubway.jpg, NewYorkSubwaySmall.jpg | geojson=NewYorkSubway }} | | {{#display_map:image layers=NewYorkSubway.jpg, NewYorkSubwaySmall.jpg }} |
| </pre> | | </pre> |
|
| |
|
| {{#display_map: | | {{#display_map: |
| |image layers=NewYorkSubway.jpg, NewYorkSubwaySmall.jpg | | |image layers=NewYorkSubway.jpg, NewYorkSubwaySmall.jpg |
| | |service=leaflet |
| | |height=300px |
| | |scrollzoom=off |
| | }} |
| | |
| | <pre> |
| | {{#display_map:image layers=NewYorkSubway.jpg | geojson=NewYorkSubway }} |
| | </pre> |
| | |
| | {{#display_map: |
| | |image layers=NewYorkSubway.jpg |
| |service=leaflet | | |service=leaflet |
| |height=300px | | |height=300px |
Line 95: |
Line 112: |
| |geojson=NewYorkSubway | | |geojson=NewYorkSubway |
| |zoom=3 | | |zoom=3 |
| | }} |
| | |
| | == Copy coords == |
| | |
| | Right-click on a marker to copy its coordinates. |
| | |
| | <pre> |
| | {{#leaflet:Hong Kong; Macau |
| | |copycoords=yes |
| | |zoom=10 |
| | }} |
| | </pre> |
| | |
| | {{#leaflet:Hong Kong; Macau |
| | |copycoords=yes |
| | |height=300px |
| | |scrollzoom=off |
| | |zoom=10 |
| }} | | }} |
Leaflet maps can be customized using various parameters.
This page lists examples. For an overview of available parameters and how to use them, see Customizing Leaflet Maps.
Markers, Polygons, Lines, etc
See Displaying Leaflet maps
Layers
{{#display_map:
|layers=OpenTopoMap,OpenStreetMap
|zoom=1
}}
Loading map...
{"minzoom":false,"maxzoom":false,"mappingservice":"leaflet","width":"auto","height":"300px","centre":false,"title":"","label":"","icon":"","lines":[],"polygons":[],"circles":[],"rectangles":[],"copycoords":false,"static":false,"zoom":1,"defzoom":14,"layers":["OpenTopoMap","OpenStreetMap"],"image layers":[],"overlays":[],"resizable":false,"fullscreen":false,"scrollwheelzoom":false,"cluster":false,"clustermaxzoom":20,"clusterzoomonclick":true,"clustermaxradius":80,"clusterspiderfy":true,"geojson":"","clicktarget":"","imageLayers":[],"locations":[],"imageoverlays":null}
Note: Maps code repository â List of available layers.
Overlays
{{#display_map:Calais; Dover
|overlaylayers=OpenSeaMap
}}
Loading map...
{"minzoom":false,"maxzoom":false,"mappingservice":"leaflet","width":"auto","height":"300px","centre":false,"title":"","label":"","icon":"","lines":[],"polygons":[],"circles":[],"rectangles":[],"copycoords":false,"static":false,"zoom":false,"defzoom":14,"layers":["OpenStreetMap"],"image layers":[],"overlays":["OpenSeaMap"],"resizable":false,"fullscreen":false,"scrollwheelzoom":false,"cluster":false,"clustermaxzoom":20,"clusterzoomonclick":true,"clustermaxradius":80,"clusterspiderfy":true,"geojson":"","clicktarget":"","imageLayers":[],"locations":[{"text":"","title":"","link":"","lat":50.9524769,"lon":1.8538446,"icon":""},{"text":"","title":"","link":"","lat":51.1251275,"lon":1.3134228,"icon":""}],"imageoverlays":null}
Fullscreen
{{#display_map:Berlin
|fullscreen=on
}}
Loading map...
{"minzoom":false,"maxzoom":false,"mappingservice":"leaflet","width":"auto","height":"300px","centre":false,"title":"","label":"","icon":"","lines":[],"polygons":[],"circles":[],"rectangles":[],"copycoords":false,"static":false,"zoom":false,"defzoom":14,"layers":["OpenStreetMap"],"image layers":[],"overlays":[],"resizable":false,"fullscreen":true,"scrollwheelzoom":false,"cluster":false,"clustermaxzoom":20,"clusterzoomonclick":true,"clustermaxradius":80,"clusterspiderfy":true,"geojson":"","clicktarget":"","imageLayers":[],"locations":[{"text":"","title":"","link":"","lat":52.5170365,"lon":13.3888599,"icon":""}],"imageoverlays":null}
Resizable
{{#display_map:New York City
|resizable=on
}}
Loading map...
{"minzoom":false,"maxzoom":false,"mappingservice":"leaflet","width":"auto","height":"300px","centre":false,"title":"","label":"","icon":"","lines":[],"polygons":[],"circles":[],"rectangles":[],"copycoords":false,"static":false,"zoom":false,"defzoom":14,"layers":["OpenStreetMap"],"image layers":[],"overlays":[],"resizable":true,"fullscreen":false,"scrollwheelzoom":false,"cluster":false,"clustermaxzoom":20,"clusterzoomonclick":true,"clustermaxradius":80,"clusterspiderfy":true,"geojson":"","clicktarget":"","imageLayers":[],"locations":[{"text":"","title":"","link":"","lat":40.7127281,"lon":-74.0060152,"icon":""}],"imageoverlays":null}
Click target
{{#display_map:Berlin
|clicktarget=https://www.google.com/maps/@%lat%,%long%,8z
|zoom=8
}}
Loading map...
{"minzoom":false,"maxzoom":false,"mappingservice":"leaflet","width":"auto","height":"300px","centre":false,"title":"","label":"","icon":"","lines":[],"polygons":[],"circles":[],"rectangles":[],"copycoords":false,"static":false,"zoom":8,"defzoom":14,"layers":["OpenStreetMap"],"image layers":[],"overlays":[],"resizable":false,"fullscreen":false,"scrollwheelzoom":false,"cluster":false,"clustermaxzoom":20,"clusterzoomonclick":true,"clustermaxradius":80,"clusterspiderfy":true,"geojson":"","clicktarget":"https://www.google.com/maps/@%lat%,%long%,8z","imageLayers":[],"locations":[{"text":"","title":"","link":"","lat":52.5170365,"lon":13.3888599,"icon":""}],"imageoverlays":null}
Image layers
{{#display_map:image layers=NewYorkSubway.jpg, NewYorkSubwaySmall.jpg }}
Loading map...
{"minzoom":false,"maxzoom":false,"mappingservice":"leaflet","width":"auto","height":"300px","centre":false,"title":"","label":"","icon":"","lines":[],"polygons":[],"circles":[],"rectangles":[],"copycoords":false,"static":false,"zoom":false,"defzoom":14,"layers":["OpenStreetMap"],"image layers":["NewYorkSubway.jpg","NewYorkSubwaySmall.jpg"],"overlays":[],"resizable":false,"fullscreen":false,"scrollwheelzoom":false,"cluster":false,"clustermaxzoom":20,"clusterzoomonclick":true,"clustermaxradius":80,"clusterspiderfy":true,"geojson":"","clicktarget":"","imageLayers":[{"name":"NewYorkSubway.jpg","url":"https://pro-wiki.s3.amazonaws.com/1644153356/f/fe/NewYorkSubway.jpg","width":100,"height":189.22934076137417},{"name":"NewYorkSubwaySmall.jpg","url":"https://pro-wiki.s3.amazonaws.com/1644153356/8/8d/NewYorkSubwaySmall.jpg","width":100,"height":189.22934076137417}],"locations":[],"imageoverlays":null}
{{#display_map:image layers=NewYorkSubway.jpg | geojson=NewYorkSubway }}
Loading map...
{"minzoom":false,"maxzoom":false,"mappingservice":"leaflet","width":"auto","height":"300px","centre":false,"title":"","label":"","icon":"","lines":[],"polygons":[],"circles":[],"rectangles":[],"copycoords":false,"static":false,"zoom":3,"defzoom":14,"layers":["OpenStreetMap"],"image layers":["NewYorkSubway.jpg"],"overlays":[],"resizable":false,"fullscreen":false,"scrollwheelzoom":false,"cluster":false,"clustermaxzoom":20,"clusterzoomonclick":true,"clustermaxradius":80,"clusterspiderfy":true,"geojson":{"type":"FeatureCollection","features":[{"type":"Feature","properties":{"title":"Pennsyl Station","description":""},"geometry":{"type":"Polygon","coordinates":[[[36.9375,97.465104],[36.9375,99.558854],[40.8125,99.558854],[40.8125,97.465104],[36.9375,97.465104]]]}},{"type":"Feature","properties":[],"geometry":{"type":"Point","coordinates":[41.0625,93.496354]}},{"type":"Feature","properties":{"title":"Station name","description":"And a fancy description"},"geometry":{"type":"Point","coordinates":[55.375,93.652604]}}]},"clicktarget":"","GeoJsonSource":"NewYorkSubway","GeoJsonRevisionId":93,"imageLayers":[{"name":"NewYorkSubway.jpg","url":"https://pro-wiki.s3.amazonaws.com/1644153356/f/fe/NewYorkSubway.jpg","width":100,"height":189.22934076137417}],"locations":[],"imageoverlays":null}
Copy coords
Right-click on a marker to copy its coordinates.
{{#leaflet:Hong Kong; Macau
|copycoords=yes
|zoom=10
}}
Loading map...
{"minzoom":false,"maxzoom":false,"mappingservice":"leaflet","width":"auto","height":"300px","centre":false,"title":"","label":"","icon":"","lines":[],"polygons":[],"circles":[],"rectangles":[],"copycoords":true,"static":false,"zoom":10,"defzoom":14,"layers":["OpenStreetMap"],"image layers":[],"overlays":[],"resizable":false,"fullscreen":false,"scrollwheelzoom":false,"cluster":false,"clustermaxzoom":20,"clusterzoomonclick":true,"clustermaxradius":80,"clusterspiderfy":true,"geojson":"","clicktarget":"","imageLayers":[],"locations":[{"text":"","title":"","link":"","lat":22.350627,"lon":114.1849161,"icon":""},{"text":"","title":"","link":"","lat":22.1899448,"lon":113.5380454,"icon":""}],"imageoverlays":null}