leaflet-tilelayer-swiss
Advanced tools
Comparing version 1.0.1 to 2.0.0
{ | ||
"name": "leaflet-tilelayer-swiss", | ||
"version": "1.0.1", | ||
"description": "Leaflet.TileLayer.Swiss is a Leaflet plugin for displaying national maps of Switzerland using WMTS services of swisstopo.", | ||
"main": "Leaflet.TileLayer.Swiss.js", | ||
"version": "2.0.0", | ||
"description": "Leaflet.TileLayer.Swiss is a Leaflet plugin for displaying national maps of Switzerland using map tiles from Swisstopo.", | ||
"source": "src/index.js", | ||
"main": "dist/Leaflet.TileLayer.Swiss.cjs.js", | ||
"module": "dist/Leaflet.TileLayer.Swiss.esm.js", | ||
"browser": "dist/Leaflet.TileLayer.Swiss.umd.js", | ||
"unpkg": "dist/Leaflet.TileLayer.Swiss.umd.js", | ||
"scripts": { | ||
"build": "rollup --config", | ||
"dev": "rollup --config --watch", | ||
"eslint": "eslint .", | ||
"prepare": "npm run build", | ||
"test": "jest" | ||
}, | ||
"repository": { | ||
"type": "git", | ||
"url": "git://github.com/rzoller/Leaflet.TileLayer.Swiss" | ||
"url": "git://github.com/rkaravia/Leaflet.TileLayer.Swiss" | ||
}, | ||
"keywords": [], | ||
"author": "Roman Zoller", | ||
"files": [ | ||
"/src", | ||
"/dist" | ||
], | ||
"author": "Roman Karavia", | ||
"license": "MIT", | ||
"peerDependencies": { | ||
"leaflet": "^1.3.1", | ||
"proj4": "^2.4.4", | ||
"proj4leaflet": "^1.0.2" | ||
"leaflet": "^1.6.0" | ||
}, | ||
"devDependencies": { | ||
"@babel/core": "^7.7.5", | ||
"@babel/preset-env": "^7.7.6", | ||
"babel-jest": "^24.9.0", | ||
"eslint": "^6.7.2", | ||
"eslint-config-airbnb-base": "^14.0.0", | ||
"eslint-plugin-import": "^2.19.1", | ||
"eslint-plugin-jest": "^23.1.1", | ||
"jest": "^24.9.0", | ||
"leaflet": "^1.6.0", | ||
"rollup": "^1.27.12", | ||
"rollup-plugin-buble": "^0.19.8", | ||
"rollup-plugin-commonjs": "^10.1.0", | ||
"rollup-plugin-livereload": "^1.0.4", | ||
"rollup-plugin-node-resolve": "^5.2.0", | ||
"rollup-plugin-serve": "^1.0.1", | ||
"rollup-plugin-terser": "^5.1.3", | ||
"swissgrid": "^1.0.1" | ||
} | ||
} |
163
README.md
@@ -6,48 +6,65 @@ [![npm version](https://img.shields.io/npm/v/leaflet-tilelayer-swiss.svg)](https://www.npmjs.com/package/leaflet-tilelayer-swiss) | ||
Leaflet.TileLayer.Swiss is a [Leaflet](https://leafletjs.com/) plugin for | ||
displaying national maps of Switzerland using WMTS services of | ||
[swisstopo](https://www.swisstopo.admin.ch/en/home.html). | ||
This plugin is not affiliated with or endorsed by swisstopo. | ||
displaying national maps of Switzerland using map tiles from | ||
[Swisstopo](https://www.swisstopo.ch/). | ||
This plugin is not affiliated with or endorsed by Swisstopo. | ||
_Requires [Leaflet](https://leafletjs.com/), [Proj4js](http://proj4js.org/), | ||
[Proj4Leaflet](https://kartena.github.io/Proj4Leaflet/). Tested with the | ||
versions listed as peerDependencies in | ||
[package.json](https://github.com/rzoller/Leaflet.TileLayer.Swiss/blob/master/package.json)._ | ||
_Requires [Leaflet](https://leafletjs.com/) version 1.x_ | ||
## Demo | ||
- [Basic example](https://rzoller.ch/Leaflet.TileLayer.Swiss/examples/basic.html) | ||
with one map layer | ||
- [Advanced example](https://rzoller.ch/Leaflet.TileLayer.Swiss/examples/advanced.html) | ||
with multiple map layers | ||
- [List of all available layers](https://rzoller.ch/Leaflet.TileLayer.Swiss/examples/layers.html) | ||
The [quick start example](https://leaflet-tilelayer-swiss.karavia.ch/) | ||
is a good place to start. | ||
There is also a [list of all available map layers](https://leaflet-tilelayer-swiss.karavia.ch/layers.html) | ||
and a [slighly more advanced example](https://leaflet-tilelayer-swiss.karavia.ch/advanced.html). | ||
## Usage | ||
### swisstopo web access | ||
### Prerequisites | ||
Most of the base map layers come with some usage restriction which is enforced | ||
by checking the [HTTP Referer](https://en.wikipedia.org/wiki/HTTP_referer) of | ||
map tile requests. | ||
- Leaflet library, see [Leaflet quick start guide](https://leafletjs.com/examples/quick-start/) | ||
- [Swisstopo web access](#swisstopo-web-access) if you want to publish your application | ||
- `localhost` is always accepted as as a Referer. | ||
- In order to include a map on a website hosted at example.com, a | ||
[swisstopo web access](https://shop.swisstopo.admin.ch/en/products/geoservice/swisstopo_geoservices/WMTS_info) | ||
account for example.com is required. There is a free tier (no credit | ||
card required) limited to 25 gigapixels per year. | ||
### Quick start | ||
Most overlay layers are freely accessible, see | ||
[list of layers and their accessiblity](https://api3.geo.admin.ch/api/faq/index.html#which-layers-are-available). | ||
Include this plugin after the Leaflet JavaScript file: | ||
### Basic example | ||
```html | ||
<script src="https://unpkg.com/leaflet-tilelayer-swiss@2.0.0/dist/Leaflet.TileLayer.Swiss.js"></script> | ||
``` | ||
Put a div element with a certain id where you want your map to be: | ||
```html | ||
<div id="mapid"></div> | ||
``` | ||
Make sure the map container has a defined height, for example by setting it in CSS: | ||
```css | ||
#mapid { height: 400px; } | ||
``` | ||
Set up the Swiss map: | ||
```javascript | ||
// Create a map with LV95 (EPSG:2056) CRS and default base map layer | ||
var map = L.map('map', { | ||
crs: L.TileLayer.Swiss.EPSG_2056, | ||
layers: [L.tileLayer.swiss()], | ||
maxBounds: L.TileLayer.Swiss.latLngBounds | ||
// Create map | ||
var map = L.map('mapid', { | ||
// Use LV95 (EPSG:2056) projection | ||
crs: L.CRS.EPSG2056, | ||
}); | ||
// Center on EPSG:2056 coordinates [2600000, 1200000] | ||
map.setView(L.TileLayer.Swiss.unproject_2056(L.point([2600000, 1200000])), 16); | ||
// Add Swiss layer with default options | ||
var swissLayer = L.tileLayer.swiss().addTo(map); | ||
// Limit map movement to layer bounds | ||
map.setMaxBounds(swissLayer.options.bounds) | ||
// Center the map on Switzerland | ||
map.fitBounds(swissLayer.options.switzerlandBounds); | ||
// Add a marker with a popup in Bern | ||
L.marker(L.CRS.EPSG2056.unproject(L.point(2600000, 1200000))).addTo(map) | ||
.bindPopup('The old observatory') | ||
.openPopup(); | ||
``` | ||
@@ -61,13 +78,15 @@ | ||
L.tileLayer.swiss({ | ||
// Coordinate reference system. EPSG_2056 and EPSG_21871 are available. | ||
crs: L.TileLayer.Swiss.EPSG_2056 | ||
// Image format (jpeg or png). Only one format is available per layer. | ||
format: 'jpeg', | ||
// Layer name. | ||
layer: 'ch.swisstopo.pixelkarte-farbe', | ||
// Maximum zoom. Availability of zoom levels depends on the layer. | ||
maxZoom: 27, | ||
// Timestamp. Most (but not all) layers have a 'current' timestamp. | ||
// Some layers have multiple timestamps. | ||
timestamp: 'current' | ||
// Coordinate reference system. EPSG2056 and EPSG21871 are available. | ||
crs: L.CRS.EPSG2056 | ||
// Image format (jpeg or png). Only one format is available per layer. | ||
format: 'jpeg', | ||
// Layer name. | ||
layer: 'ch.swisstopo.pixelkarte-farbe', | ||
// Maximum zoom. Availability of zoom levels depends on the layer. | ||
maxNativeZoom: 27, | ||
// Timestamp. Most (but not all) layers have a 'current' timestamp. | ||
// Some layers have multiple versions with different timestamps. | ||
timestamp: 'current', | ||
// Map tile URL. Appropriate defaults are chosen based on the crs option. | ||
url: 'https://wmts{s}.geo.admin.ch/1.0.0/{layer}/default/{timestamp}/2056/{z}/{x}/{y}.{format}' | ||
}); | ||
@@ -77,5 +96,4 @@ ``` | ||
A list with all available layers and corresponding options is available | ||
[here](https://rzoller.ch/Leaflet.TileLayer.Swiss/examples/layers.html). | ||
[here](https://leaflet-tilelayer-swiss.karavia.ch/layers.html). | ||
### Coordinate reference systems (CRS) | ||
@@ -85,4 +103,4 @@ | ||
- New (default): [CH1903+ / LV95 (EPSG:2056)](https://epsg.io/2056) | ||
- Old: [CH1903 / LV03 (EPSG:21781)](https://epsg.io/21781) | ||
- New (default): [LV95 (EPSG:2056)](https://epsg.io/2056) | ||
- Old: [LV03 (EPSG:21781)](https://epsg.io/21781) | ||
@@ -92,23 +110,42 @@ In order to use EPSG:21781, both map and layer CRS have to be adapted: | ||
```javascript | ||
var map = L.map('map', { | ||
crs: L.TileLayer.Swiss.EPSG_21781, | ||
layers: [L.tileLayer.swiss({ | ||
crs: L.TileLayer.Swiss.EPSG_21781 | ||
})], | ||
maxBounds: L.TileLayer.Swiss.latLngBounds | ||
}); | ||
var map = L.map('map', { crs: L.CRS.EPSG21781 }); | ||
var swissLayer = L.tileLayer.swiss({ crs: L.CRS.EPSG21781 }).addTo(map); | ||
map.setView(L.TileLayer.Swiss.unproject_21781(L.point([600000, 200000])), 16); | ||
map.setView(L.CRS.EPSG21781.unproject(L.point(600000, 200000)), 16); | ||
``` | ||
## Swisstopo web access | ||
You will need to register with Swisstopo if you want to publish an application that | ||
displays base map layers from Swisstopo. | ||
If you have your own domain (e.g. example.com), you can | ||
[sign up for Swisstopo web access](https://www.swisstopo.ch/webaccess). There is a free tier (no credit card required) limited to 25 gigapixels of map tiles per year, and there are paid options if you need more. | ||
If you do not have your own domain, sadly you are out of luck, as Swisstopo currently does not provide | ||
any other way to sign up for access to the map tiles. | ||
The usage restriction is enforced by checking the [HTTP Referer](https://en.wikipedia.org/wiki/HTTP_referer) | ||
header, so your application will automatically work once you have signed up. | ||
You will probably also want to test your application locally before publishing it. `localhost` is also accepted | ||
as a Referer, so if you | ||
[run a local web server](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/set_up_a_local_testing_server#Running_a_simple_local_HTTP_server), you should be able to access the map tiles. | ||
Swisstopo also provides some overlay layers which are freely accessible, see | ||
[list of layers and their accessiblity](https://api3.geo.admin.ch/api/faq/index.html#which-layers-are-available). | ||
## Attribution | ||
Swisstopo, like most map tile providers, requires that you display a copyright attribution below the map. | ||
This plugin adds a map attribution which links to | ||
[swisstopo](https://www.swisstopo.admin.ch/en/home.html), the same as it is done | ||
by the [official swisstopo API](https://api3.geo.admin.ch/). | ||
[Swisstopo](https://www.swisstopo.ch/), the same as it is done | ||
by the [official Swisstopo API](https://api3.geo.admin.ch/). | ||
The | ||
[terms of service](https://www.swisstopo.admin.ch/en/home/meta/conditions/geoservices/free-geoservice-license.html) | ||
suggest the phrase "Source: Federal Topographical Office (agreement no.)", which | ||
you may want to use if you have an agreement number from swisstopo. | ||
suggest using the phrase "Source: Federal Topographical Office (agreement no.)", which | ||
you may want to use if you have an agreement number from Swisstopo. You will probably | ||
get such a number if you sign up for paid access to the map tiles. | ||
@@ -121,3 +158,3 @@ ## License | ||
Thanks to [swisstopo](https://www.swisstopo.admin.ch/en/home.html) and the | ||
Thanks to [Swisstopo](https://www.swisstopo.ch/) and the | ||
[Geoinformation Act](https://www.admin.ch/opc/en/classified-compilation/20050726/index.html) | ||
@@ -128,3 +165,3 @@ for providing excellent geodata. | ||
[blog post](https://www.procrastinatio.org/2014/11/16/native-wmts-leaflet/) | ||
taught me how to use swisstopo layers in Leaflet a few year ago. | ||
taught me how to use Swisstopo layers in Leaflet a few year ago. | ||
@@ -134,4 +171,4 @@ ## See also | ||
- [Documentation](https://api3.geo.admin.ch/) and | ||
[source](https://github.com/geoadmin/ol3) of the official swisstopo API based | ||
on OpenLayers 3 | ||
[source](https://github.com/geoadmin/ol3) of the official Swisstopo API based | ||
on OpenLayers 4 | ||
- Terms of service for the | ||
@@ -141,2 +178,2 @@ [free](https://www.swisstopo.admin.ch/en/home/meta/conditions/geoservices/free-geoservice-license.html) | ||
[paid](https://www.swisstopo.admin.ch/en/home/meta/conditions/geoservices/geoservice-license.html) | ||
tiers of swisstopo | ||
tiers of Swisstopo |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
82431
1
14
229
171
17
3
2