franzz/spot
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

swap open topo map with LINZ

Browse Source
This commit is contained in:
Franzz
2018-10-08 22:12:57 +02:00
parent cca50b20be
commit b3eb748a90
4 changed files with 26 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
masks/messages.html
View File

@@ -3,9 +3,9 @@
<div class="loader fa fa-map"></div> <div class="loader fa fa-map"></div>
</div> </div>
<div id="legend"> <div id="legend">
<div class="line green">Te Araroa</div> <div class="line te_araroa">Te Araroa</div>
<div class="line blue">Routeburn Track</div> <div class="line routeburn">Routeburn Track</div>
<div class="line red">Hors rando</div> <div class="line hitchhiking">Hors rando</div>
</div> </div>
<div id="feed"> <div id="feed">
<div id="posts"> <div id="posts">
@@ -21,8 +21,8 @@ oSpot.pageInit = function(asHash)
{ {
/* TODO /* TODO
- keep tooltip open so pictures can be clicked on (use popup?) - keep tooltip open so pictures can be clicked on (use popup?)
- switch to opentopomap when zoom > 10
- apply 30 % offset to all re-centering - apply 30 % offset to all re-centering
- Track Names
*/ */
self.tmp('$Map', $('#map')); self.tmp('$Map', $('#map'));
@@ -87,9 +87,9 @@ oSpot.pageInit = function(asHash)
//Tile layers //Tile layers
var oMapBoxSat = L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}@2x.png?access_token='+self.vars('mapbox_key'), {id: 'mapbox.satellite', minZoom: 0, maxZoom: 19}), var oMapBoxSat = L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}@2x.png?access_token='+self.vars('mapbox_key'), {id: 'mapbox.satellite', minZoom: 0, maxZoom: 19}),
oOpenTopoMap = L.tileLayer('https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png', {id: 'OpenTopoMap', minZoom: 2, maxZoom: 19}); //oOpenTopoMap = L.tileLayer('https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png', {id: 'OpenTopoMap', minZoom: 2, maxZoom: 19});
//oMapBoxStreet = L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token='+self.vars('mapbox_key'), {id: 'mapbox.streets'}), //oMapBoxStreet = L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token='+self.vars('mapbox_key'), {id: 'mapbox.streets'}),
//oLinz = L.tileLayer('http://tiles-{s}.data-cdn.linz.govt.nz/services;key=92193c0af382409a98694d3e4aa8bd46/tiles/v4/layer=50767/EPSG:3857/{z}/{x}/{y}.png', {id: 'Linz', maxZoom: 17, continuousWorld: true, attribution: 'Sourced from LINZ. CC BY 4.0', subdomains:'abcd'}); oLinz = L.tileLayer('http://tiles-{s}.data-cdn.linz.govt.nz/services;key=92193c0af382409a98694d3e4aa8bd46/tiles/v4/layer=50767/EPSG:3857/{z}/{x}/{y}.png', {id: 'Linz', maxZoom: 17, continuousWorld: true, attribution: 'Sourced from LINZ. CC BY 4.0', subdomains:'abcd'});
//oGoogleSatellite = L.tileLayer('https://mt.google.com/vt/lyrs=y&x={x}&y={y}&z={z}', {id: 'GoogleSatellite', minZoom: 1, maxZoom: 22}); //oGoogleSatellite = L.tileLayer('https://mt.google.com/vt/lyrs=y&x={x}&y={y}&z={z}', {id: 'GoogleSatellite', minZoom: 1, maxZoom: 22});
//Map //Map
@@ -127,24 +127,25 @@ oSpot.pageInit = function(asHash)
}); });
//Controls //Controls
L.control.layers({'Satellite': oMapBoxSat, 'Open Topo Map': oOpenTopoMap}, null, {position: 'topleft'}).addTo(oMap); L.control.layers({'Satellite': oMapBoxSat, 'LINZ': oLinz}, null, {position: 'topleft'}).addTo(oMap);
//Te Araroa track //Te Araroa track
$.ajax({ $.ajax({
dataType: 'json', dataType: 'json',
url: 'kml/TeAraroaTrail_simplified.geojson', url: 'kml/TeAraroaTrail_simplified.geojson',
mimeType: 'application/json', mimeType: 'application/json',
success: function(data) { success: function(aoTracks) {
L.geoJson(data, { //Get track colors
style: function(oTrack) { var asColors = {};
var sColor = ''; $('#legend').find('.line').each(function(iKey, oLegend){
switch (oTrack.properties.type) { var $Legend = $(oLegend);
case 'te_araroa': sColor = '#00ff78'; break; asColors[$Legend.attr('class').replace('line', '').trim()] = $Legend.css('border-top-color');
case 'routeburn': sColor = '#0000ff'; break; });
case 'hitchhiking': sColor = '#FF7814'; break;
} //Assign track color
return {color: sColor}; L.geoJson(aoTracks, {
}}).addTo(oMap); style: function(oTrack) {return {color: asColors[oTrack.properties.type]};}
}).addTo(oMap);
} }
}); });
@@ -164,12 +165,12 @@ oSpot.pageInit = function(asHash)
//Marker events //Marker events
oMarker.on({ oMarker.on({
mouseover: function(){ /*mouseover: function(){
}, },
mouseout: function(){ mouseout: function(){
}, },*/
click: function(oPoint){ click: function(oPoint){
self.tmp('map').setView(oPoint.latlng, 15); self.tmp('map').setView(oPoint.latlng, 15);
} }

2
style/spot.css
View File

File diff suppressed because one or more lines are too long

2
style/spot.css.map
View File

File diff suppressed because one or more lines are too long

6
style/spot.scss
View File

@@ -41,14 +41,14 @@
font-size: 1em; font-size: 1em;
color: #222; color: #222;
&.green { &.te_araroa {
border-color: #00ff78; border-color: #00ff78;
} }
&.blue { &.routeburn {
border-color: #0000ff; border-color: #0000ff;
} }
&.red { &.hitchhiking {
border-color: #FF7814; border-color: #FF7814;
} }
} }