1
0
forked from MTSR/mapserver

working travelnet layer

This commit is contained in:
Thomas Rudin 2019-02-02 17:28:35 +01:00
parent 0da44f534e
commit 258993b836
4 changed files with 41 additions and 13 deletions

View File

@ -11,15 +11,25 @@
<body>
<div id="image-map"></div>
<!-- libs -->
<script src="js/lib/leaflet.js"></script>
<script src="js/lib/mithril.min.js"></script>
<!-- utils -->
<script src="js/util/debounce.js"></script>
<!-- api -->
<script src="js/api.js"></script>
<!-- components -->
<script src="js/LayerManager.js"></script>
<script src="js/SimpleCRS.js"></script>
<script src="js/WebSocketChannel.js"></script>
<script src="js/RealtimeTileLayer.js"></script>
<script src="js/CoordinatesDisplay.js"></script>
<script src="js/overlays/TravelnetOverlay.js"></script>
<!-- bootstrap -->
<script src="js/main.js"></script>
</body>

View File

@ -18,7 +18,7 @@ api.getConfig().then(function(cfg){
crs: SimpleCRS
});
map.attributionControl.addAttribution('<a href="https://github.com/thomasrudin-mt/mapserver">Mapserver</a>');
map.attributionControl.addAttribution('<a href="https://github.com/thomasrudin-mt/mapserver">Minetest Mapserver</a>');
var layers = {};
var overlays = {}

View File

@ -10,11 +10,13 @@ var TravelnetIcon = L.icon({
var TravelnetOverlay = L.LayerGroup.extend({
initialize: function(wsChannel, layerMgr) {
L.LayerGroup.prototype.initialize.call(this);
this.layerMgr = layerMgr;
this.wsChannel = wsChannel;
this.onLayerChange = this.onLayerChange.bind(this);
this.onMapMove = this.onMapMove.bind(this);
this.onMapMove = debounce(this.onMapMove.bind(this), 50);
},
onLayerChange: function(layer){
@ -36,21 +38,20 @@ var TravelnetOverlay = L.LayerGroup.extend({
.then(function(travelnets){
//TODO: remove non-existing markers, add new ones
if (!full)
this.clearLayers();
console.log(travelnets);
//TODO: attributes, coords
var marker = L.marker([travelnet.z, travelnet.x], {icon: TravelnetIcon});
self.clearLayers();
travelnets.forEach(function(travelnet){
var popup = "<h4>" + travelnet.name + "</h4><hr>" +
console.log(travelnet);
var popup = "<h4>" + travelnet.attributes.station_name + "</h4><hr>" +
"<b>X: </b> " + travelnet.x + "<br>" +
"<b>Y: </b> " + travelnet.y + "<br>" +
"<b>Z: </b> " + travelnet.z + "<br>" +
"<b>Network: </b> " + travelnet.network + "<br>" +
"<b>Owner: </b> " + travelnet.owner + "<br>";
"<b>Network: </b> " + travelnet.attributes.station_network + "<br>" +
"<b>Owner: </b> " + travelnet.attributes.owner + "<br>";
var marker = L.marker([travelnet.z, travelnet.x], {icon: TravelnetIcon});
marker.bindPopup(popup).addTo(self);
});
})
@ -58,12 +59,15 @@ var TravelnetOverlay = L.LayerGroup.extend({
},
onAdd: function(map) {
map.on("zoomend", this.onMapMove);
map.on("moveend", this.onMapMove);
this.layerMgr.addListener(this.onLayerChange);
console.log("TravelnetOverlay.onAdd", map);
this.reDraw(true)
},
onRemove: function(map) {
map.off("zoomend", this.onMapMove);
map.off("moveend", this.onMapMove);
this.layerMgr.removeListener(this.onLayerChange);
console.log("TravelnetOverlay.onRemove");
}
});

View File

@ -0,0 +1,14 @@
function debounce(func, wait, immediate) {
var timeout;
return function() {
var context = this, args = arguments;
var later = function() {
timeout = null;
if (!immediate) func.apply(context, args);
};
var callNow = immediate && !timeout;
clearTimeout(timeout);
timeout = setTimeout(later, wait);
if (callNow) func.apply(context, args);
};
};