mirror
/
turtlestitch
kopia lustrzana https://github.com/backface/turtlestitch
1
0
Forkuj 0
Kod Zgłoszenia Projekty Wydania Wiki Aktywność

added various different tile hosts for maps

pull/89/head
jmoenig 2019-05-28 19:33:47 +02:00
rodzic 8b68d72bbc
commit 774cb29c5c
3 zmienionych plików z 93 dodań i 25 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

3
HISTORY.md
Wyświetl plik

@ -80,6 +80,9 @@
* German
* French
### 2019-05-28
* Maps: added various different tile hosts
### 2019-05-25
* added credits and license information to map costumes

2
snap.html
Wyświetl plik

@ -17,7 +17,7 @@
<script type="text/javascript" src="src/symbols.js?version=2019-03-07"></script>
<script type="text/javascript" src="src/sketch.js?version=2019-02-22"></script>
<script type="text/javascript" src="src/video.js?version=2019-05-22"></script>
<script type="text/javascript" src="src/maps.js?version=2019-05-25"></script>
<script type="text/javascript" src="src/maps.js?version=2019-05-28"></script>
<script type="text/javascript" src="src/xml.js?version=2018-11-12"></script>
<script type="text/javascript" src="src/store.js?version=2019-04-04"></script>
<script type="text/javascript" src="src/locale.js?version=2019-05-19"></script>

113
src/maps.js
Wyświetl plik

@ -38,23 +38,82 @@
// Global stuff ////////////////////////////////////////////////////////
modules.maps = '2019-May-25';
modules.maps = '2019-May-28';
// WorldMap /////////////////////////////////////////////////////////////
function WorldMap() {
this.url = 'api.tiles.mapbox.com/v4/mapbox.streets';
// this.url = 'tile.openstreetmap.org';
// this.url = 'maps.wikimedia.org/osm-intl';
// this.subdomains = ['a', 'b', 'c'];
this.apiSuffix = '?access_token=' +
'pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.' +
'rJcFIG214AriISLbB6B5aw';
function WorldMap(host) {
this.tileServers = {
OpenStreetMap: {
url: 'tile.openstreetmap.org',
subdomains: ['a', 'b', 'c'],
key: null,
min: 0,
max: 19,
credits: 'Map data \u00A9 OpenStreetMap contributors' +
'CC-BY-SA, Imagery \u00A9 Mapnik'
},
Wikimedia: {
url: 'maps.wikimedia.org/osm-intl',
subdomains: null,
key: null,
min: 0,
max: 19,
credits: 'Map data \u00A9 OpenStreetMap contributors, ' +
'CC-BY-SA, Imagery \u00A9 Wikimedia'
},
Watercolor: {
url: 'stamen-tiles.a.ssl.fastly.net/watercolor',
subdomains: null,
key: null,
min: 0,
max: 20,
credits: 'Map data \u00A9 OpenStreetMap contributors, ' +
'CC-BY-SA, Imagery \u00A9 Stamen, CC-BY-3.0.'
},
'Toner': {
url: 'stamen-tiles.a.ssl.fastly.net/toner',
subdomains: null,
key: null,
min: 0,
max: 20,
credits: 'Map data \u00A9 OpenStreetMap contributors, ' +
'CC-BY-SA, Imagery \u00A9 Stamen, CC-BY-3.0.'
},
'Terrain': {
url: 'stamen-tiles.a.ssl.fastly.net/terrain',
subdomains: null,
key: null,
min: 0,
max: 16,
credits: 'Map data \u00A9 OpenStreetMap contributors, ' +
'CC-BY-SA, Imagery \u00A9 Stamen, CC-BY-3.0.'
},
Topographic: {
url: 'tile.opentopomap.org',
subdomains: null, //['a', 'b', 'c'],
key: null,
min: 0,
max: 20,
credits: 'Map data \u00A9 OpenStreetMap contributors, ' +
'CC-BY-SA, Imagery \u00A9 Opentopomaps'
},
'Mapbox (experimental)': {
url: 'api.tiles.mapbox.com/v4/mapbox.streets',
subdomains: null,
key: '?access_token=' +
'pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycX' +
'BndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw',
min: 0,
max: 20,
credits: 'Map data \u00A9 OpenStreetMap contributors, ' +
'CC-BY-SA, Imagery \u00A9 Mapbox'
}
};
this.api = this.tileServers[host || 'Wikimedia'];
this.lon = -122.257852;
this.lat = 37.872099;
this.zoom = 13;
this.minZoom = 0;
this.maxZoom = 20;
this.position = new Point(
this.tileXfromLon(this.lon),
this.tileYfromLat(this.lat)
@ -68,6 +127,12 @@ function WorldMap() {
this.loading = 0;
}
WorldMap.prototype.setHost = function (host) {
this.api = this.tileServers[host || 'Wikimedia'];
this.initializeCredits();
this.setZoom(this.zoom);
};
WorldMap.prototype.setView = function (lon, lat) {
this.lat = lat;
this.lon = lon;
@ -75,9 +140,8 @@ WorldMap.prototype.setView = function (lon, lat) {
};
WorldMap.prototype.setZoom = function (num) {
this.zoom = Math.max(Math.min(this.maxZoom, Math.floor(num)), 0);
this.zoom = Math.max(Math.min(this.api.max, Math.floor(num)), this.api.min);
this.refresh();
};
WorldMap.prototype.panBy = function (x, y) {
@ -160,7 +224,7 @@ WorldMap.prototype.render = function () {
mapOrigin = tileOrigin.subtract(
tileDistance.multiplyBy(size)
),
// sub = 0,
sub = 0,
myself = this,
max = Math.pow(2, this.zoom),
x, y, img, ctx, tileX, tileY;
@ -201,18 +265,20 @@ WorldMap.prototype.render = function () {
img.onerror = err;
myself.loading += 1;
img.src = 'https://' +
// this.subdomains[sub] + '.' +
this.url + '/' +
(this.api.subdomains ?
this.api.subdomains[sub] + '.'
: '') +
this.api.url + '/' +
this.zoom + '/' +
tileX + '/' +
tileY + '.png' +
this.apiSuffix;
/*
sub += 1;
if (sub === this.subdomains.length) {
sub = 0;
(this.api.key || '');
if (this.api.subdomains) {
sub += 1;
if (sub === this.api.subdomains.length) {
sub = 0;
}
}
*/
}
}
}
@ -221,8 +287,7 @@ WorldMap.prototype.render = function () {
WorldMap.prototype.initializeCredits = function () {
var ctx;
this.creditsTxt = new StringMorph(
' Map data \u00A9 OpenStreetMap contributors, ' +
'CC-BY-SA, Imagery \u00A9 Mapbox ',
' ' + this.api.credits + ' ',
8
);
normalizeCanvas(this.creditsTxt.image);