update mavrkercluster, and add to options
This commit is contained in:
parent
3ca9b2453d
commit
7e6aec6558
@ -1 +1 @@
|
||||
[{"id":"5dc0977b.699a88","type":"function","z":"896b28a8.437658","name":"remap property names","func":"msg.payload.lat = msg.payload.latitude;\nmsg.payload.lon = msg.payload.longitude;\nmsg.payload.layer = msg.payload.type;\nmsg.payload.icon = msg.payload.type;\nmsg.payload.name = msg.payload.id;\n\ndelete msg.payload.latitude;\ndelete msg.payload.longitude;\ndelete msg.payload.type;\nreturn msg;","outputs":1,"noerr":0,"x":460,"y":700,"wires":[["847c1290.11a68","a733a03e.317f2"]]},{"id":"847c1290.11a68","type":"debug","z":"896b28a8.437658","name":"","active":true,"console":"false","complete":"payload","x":690,"y":640,"wires":[]},{"id":"827adf5c.4cff8","type":"csv","z":"896b28a8.437658","name":"","sep":",","hdrin":true,"hdrout":"","multi":"one","ret":"\\n","temp":"","x":450,"y":620,"wires":[["5dc0977b.699a88"]]},{"id":"3dcc8183.4e218e","type":"http request","z":"896b28a8.437658","name":"","method":"GET","url":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_day.csv","x":290,"y":620,"wires":[["827adf5c.4cff8"]]},{"id":"5b57c4b6.56a8fc","type":"inject","z":"896b28a8.437658","name":"quakes","topic":"","payload":"","payloadType":"str","repeat":"900","crontab":"","once":true,"x":130,"y":620,"wires":[["3dcc8183.4e218e"]]},{"id":"e41b836e.f0c66","type":"comment","z":"896b28a8.437658","name":"Earthquake !!!","info":"Press the button on the `inject` node to get the list of earthquakes from the USGS public API.\n\nThis returns a CSV - which we then parse using the `CSV` node into individual objects.\n\nThese are then passed through a `function` to remap the property names into ones \nsuitable for the map node, and passed to the `web-socket` out node.\n\nThe map will be served at http://localhost:1880/worldmap .\nYou will need to zoom out :-)","x":130,"y":560,"wires":[]},{"id":"a733a03e.317f2","type":"worldmap","z":"896b28a8.437658","name":"","x":690,"y":700,"wires":[]},{"id":"854a8d7f.2cbdf","type":"inject","z":"896b28a8.437658","name":"zoom out map","topic":"","payload":"{\"command\":{\"layer\":\"OSM\",\"lat\":20,\"lon\":0,\"zoom\":2}}","payloadType":"json","repeat":"","crontab":"","once":true,"x":460,"y":760,"wires":[["a733a03e.317f2"]]}]
|
||||
[{"id":"44fb9955.b8db38","type":"function","z":"ff08c5aa.63eb38","name":"remap property names","func":"msg.payload.lat = msg.payload.latitude;\nmsg.payload.lon = msg.payload.longitude;\nmsg.payload.layer = msg.payload.type;\nmsg.payload.icon = msg.payload.type;\nmsg.payload.name = msg.payload.id;\n\ndelete msg.payload.latitude;\ndelete msg.payload.longitude;\ndelete msg.payload.type;\nreturn msg;","outputs":1,"noerr":0,"x":460,"y":780,"wires":[["e02ba15d.2be32","7f4939b8.4cf668"]]},{"id":"e02ba15d.2be32","type":"debug","z":"ff08c5aa.63eb38","name":"","active":true,"console":"false","complete":"payload","x":690,"y":720,"wires":[]},{"id":"1ed29706.066b09","type":"csv","z":"ff08c5aa.63eb38","name":"","sep":",","hdrin":true,"hdrout":"","multi":"one","ret":"\\n","temp":"","x":450,"y":700,"wires":[["44fb9955.b8db38"]]},{"id":"b5c3e32a.597f4","type":"http request","z":"ff08c5aa.63eb38","name":"","method":"GET","url":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_day.csv","x":290,"y":700,"wires":[["1ed29706.066b09"]]},{"id":"4dc38fda.9d0a4","type":"inject","z":"ff08c5aa.63eb38","name":"quakes","topic":"","payload":"","payloadType":"str","repeat":"600","crontab":"","once":true,"x":130,"y":700,"wires":[["b5c3e32a.597f4"]]},{"id":"6cbdaa62.aeb6c4","type":"comment","z":"ff08c5aa.63eb38","name":"Earthquake !!!","info":"Press the button on the `inject` node to get the list of earthquakes from the USGS public API.\n\nThis returns a CSV - which we then parse using the `CSV` node into individual objects.\n\nThese are then passed through a `function` to remap the property names into ones \nsuitable for the map node, and passed to the `web-socket` out node.\n\nThe map will be served at http://localhost:1880/worldmap .\nYou will need to zoom out :-)","x":130,"y":640,"wires":[]},{"id":"7f4939b8.4cf668","type":"worldmap","z":"ff08c5aa.63eb38","lat":"20","lon":"0","zoom":"2","name":"","x":690,"y":780,"wires":[]}]
|
||||
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name" : "node-red-contrib-web-worldmap",
|
||||
"version" : "1.0.12",
|
||||
"version" : "1.0.13",
|
||||
"description" : "A Node-RED node to provide a web page of a world map for plotting things on.",
|
||||
"dependencies" : {
|
||||
"express": "4.*",
|
||||
|
@ -41,6 +41,14 @@
|
||||
<option value="UK OS Opendata">UK OS Opendata</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<label for="node-input-cluster"><i class="fa fa-gears"></i> Cluster at</label>
|
||||
zoom levels less than <input type="text" id="node-input-cluster" placeholder="10 (0-19)" style="width:60px;">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<label for="node-input-maxage"><i class="fa fa-timer"></i> Max age</label>
|
||||
Remove markers after <input type="text" id="node-input-maxage" style="width:60px;"> seconds
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<label for="node-input-name"><i class="fa fa-file"></i> Name</label>
|
||||
<input type="text" id="node-input-name" placeholder="name">
|
||||
@ -79,6 +87,8 @@
|
||||
lon: {value:""},
|
||||
zoom: {value:""},
|
||||
layer: {value:""},
|
||||
cluster: {value:""},
|
||||
maxage: {value:""},
|
||||
name: {value:""}
|
||||
},
|
||||
inputs:1,
|
||||
@ -93,6 +103,10 @@
|
||||
},
|
||||
info: function() {
|
||||
return 'The map can be found [here]('+RED.settings.httpNodeRoot.slice(0,-1)+'/worldmap).';
|
||||
},
|
||||
oneditprepare: function() {
|
||||
$( "#node-input-zoom" ).spinner({min:0, max:18});
|
||||
$( "#node-input-cluster" ).spinner({min:0, max:19});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
@ -25,6 +25,8 @@ module.exports = function(RED) {
|
||||
this.lon = n.lon || "";
|
||||
this.zoom = n.zoom || "";
|
||||
this.layer = n.layer || "";
|
||||
this.cluster = n.cluster || "";
|
||||
this.maxage = n.maxage || "";
|
||||
var node = this;
|
||||
//node.log("Serving map from "+__dirname+" as "+RED.settings.httpNodeRoot.slice(0,-1)+"/worldmap");
|
||||
RED.httpNode.use("/worldmap", express.static(__dirname + '/worldmap'));
|
||||
@ -40,6 +42,8 @@ module.exports = function(RED) {
|
||||
if (node.lon && node.lon.length > 0) { c.lon = node.lon; }
|
||||
if (node.zoom && node.zoom.length > 0) { c.zoom = node.zoom; }
|
||||
if (node.layer && node.layer.length > 0) { c.layer = node.layer; }
|
||||
if (node.cluster && node.cluster.length > 0) { c.cluster = node.cluster; }
|
||||
if (node.maxage && node.maxage.length > 0) { c.maxage = node.maxage; }
|
||||
socket.emit("worldmapdata",{command:c});
|
||||
}
|
||||
});
|
||||
|
@ -68,7 +68,7 @@
|
||||
<div id="menu"><table>
|
||||
<tr><td><input type='text' name='search' id='search' size='20' style="width:150px;"/> <span onclick='doSearch();'><i class="fa fa-search fa-lg"></i></span></td></tr>
|
||||
<tr><td style="cursor:default"><i class="fa fa-spinner fa-lg fa-fw"></i> Set Max Age <input type='text' name='maxage' id='maxage' value="600" size="5" onchange='setMaxAge();'/>s</td></tr>
|
||||
<tr><td style="cursor:default"><i class="fa fa-search-plus fa-lg fa-fw"></i> Cluster at zoom <<input type='text' name='setclus' id='setclus' value="12" size="2" onchange='setCluster();'/></td></tr>
|
||||
<tr><td style="cursor:default"><i class="fa fa-search-plus fa-lg fa-fw"></i> Cluster at zoom <<input type='text' name='setclus' id='setclus' value="10" size="2" onchange='setCluster();'/></td></tr>
|
||||
<tr><td style="cursor:default"><input type='checkbox' name='panit' onclick='doPanit();'/> Auto Pan Map</td></tr>
|
||||
<tr><td style="cursor:default"><input type='checkbox' name='lockit' onclick='doLock();'/> Lock Map</td></tr>
|
||||
<tr><td style="cursor:default"><input type='checkbox' name='heatall' onclick='doHeatAll();'/> Heatmap all layers</td></tr>
|
||||
@ -142,8 +142,7 @@ ws.on('error', function() {
|
||||
|
||||
ws.on('worldmapdata', function(data) {
|
||||
if (data.command) { doCommand(data.command); delete data.command; }
|
||||
if (data.hasOwnProperty("name") && data.hasOwnProperty("lat") && data.hasOwnProperty("lon")) { setMarker(data); }
|
||||
else if (data.hasOwnProperty("name") && (data.hasOwnProperty("area") || data.hasOwnProperty("line"))) { setMarker(data); }
|
||||
if (data.hasOwnProperty("name")) { setMarker(data); }
|
||||
else { console.log("SKIP",data); }
|
||||
});
|
||||
|
||||
@ -199,7 +198,7 @@ L.control.fullscreen().addTo(map);
|
||||
|
||||
// Add the locate my position button
|
||||
L.easyButton( 'fa-crosshairs fa-lg', function() {
|
||||
map.locate({setView:true, maxZoom:15});
|
||||
map.locate({setView:true, maxZoom:16});
|
||||
}, "Locate me").addTo(map);
|
||||
|
||||
// Add the measure/ruler button
|
||||
@ -246,7 +245,7 @@ function doLock() {
|
||||
window.localStorage.setItem("lastpos",JSON.stringify(map.getCenter()));
|
||||
window.localStorage.setItem("lastzoom", map.getZoom());
|
||||
window.localStorage.setItem("lastlayer", baselayername);
|
||||
window.localStorage.setItem("clusterat", clusterAt);
|
||||
//window.localStorage.setItem("clusterat", clusterAt);
|
||||
window.localStorage.setItem("maxage", maxage);
|
||||
console.log("Saved :",JSON.stringify(map.getCenter()),map.getZoom(),baselayername);
|
||||
}
|
||||
@ -294,7 +293,7 @@ function setMaxAge() {
|
||||
setMaxAge();
|
||||
|
||||
function setCluster() {
|
||||
clusterAt = document.getElementById('setclus').value;
|
||||
clusterAt = parseInt(document.getElementById('setclus').value);
|
||||
console.log("clusterAt set :",clusterAt);
|
||||
}
|
||||
setCluster();
|
||||
@ -441,7 +440,7 @@ var addThing = function() {
|
||||
}
|
||||
|
||||
// allow double right click to zoom out
|
||||
// single right click opens a message window that send to the websocket.
|
||||
// single right click opens a message window that sends to the socket.
|
||||
var rclicked = false;
|
||||
var rtout = null;
|
||||
map.on('contextmenu', function(e) {
|
||||
@ -467,12 +466,21 @@ map.on('contextmenu', function(e) {
|
||||
function onLocationFound(e) {
|
||||
var radius = e.accuracy;
|
||||
//L.marker(e.latlng).addTo(map).bindPopup("You are within " + radius + " meters from this point").openPopup();
|
||||
L.circle(e.latlng, radius, {color:"cyan", weight:3, opacity:0.8, fill:false, clickable:false}).addTo(map);
|
||||
L.circle(e.latlng, radius, {color:"cyan", weight:4, opacity:0.8, fill:false, clickable:false}).addTo(map);
|
||||
if (e.hasOwnProperty("heading")) {
|
||||
var lengthAsDegrees = e.speed * 60 / 110540;
|
||||
var ya = e.latlng.lat + Math.sin((90-e.heading)/180*Math.PI)*lengthAsDegrees*Math.cos(e.latlng.lng/180*Math.PI);
|
||||
var xa = e.latlng.lng + Math.cos((90-e.heading)/180*Math.PI)*lengthAsDegrees;
|
||||
var lla = new L.LatLng(ya,xa);
|
||||
L.polygon([ e.latlng, lla ], {color:"cyan", weight:3, opacity:0.8, clickable:false}).addTo(map);
|
||||
}
|
||||
ws.emit("worldmap",{action:"point", lat:e.latlng.lat.toFixed(5), lon:e.latlng.lng.toFixed(5), point:"self", bearing:e.heading, speed:(e.speed*3.6 || undefined)});
|
||||
}
|
||||
function onLocationError(e) { console.log(e.message); }
|
||||
map.on('locationfound', onLocationFound);
|
||||
map.on('locationerror', onLocationError);
|
||||
|
||||
|
||||
// Add all the base layer maps
|
||||
|
||||
// Use this for OSM online maps
|
||||
@ -672,7 +680,7 @@ function setMarker(data) {
|
||||
var lay = data.layer || "not known";
|
||||
if (typeof layers[lay] == "undefined") { // add layer if if doesn't exist
|
||||
//layers[lay] = new L.LayerGroup().addTo(map);
|
||||
layers[lay] = new L.MarkerClusterGroup({maxClusterRadius:50, disableClusteringAtZoom:clusterAt}).addTo(map);
|
||||
layers[lay] = new L.MarkerClusterGroup({maxClusterRadius:50, spiderfyDistanceMultiplier:1.8, disableClusteringAtZoom:clusterAt}).addTo(map);
|
||||
overlays[lay] = layers[lay];
|
||||
layercontrol.addOverlay(layers[lay],lay);
|
||||
}
|
||||
@ -709,8 +717,9 @@ function setMarker(data) {
|
||||
else {
|
||||
//console.log("handling",data.name);
|
||||
if (typeof data.coordinates == "object") { ll = new L.LatLng(data.coordinates[1],data.coordinates[0]); }
|
||||
else { ll = new L.LatLng((data.lat*1), (data.lon*1)); }
|
||||
|
||||
else if (data.hasOwnProperty("lat") && data.hasOwnProperty("lon")) { ll = new L.LatLng((data.lat*1), (data.lon*1)); }
|
||||
else if (data.hasOwnProperty("latitude") && data.hasOwnProperty("longitude")) { ll = new L.LatLng((data.latitude*1), (data.longitude*1)); }
|
||||
else { console.log("No location:",data); return; }
|
||||
var words="<b>"+data.name+"</b><br/>";
|
||||
|
||||
// Create the icons... handle ship, earthquake as specials
|
||||
@ -837,9 +846,9 @@ function setMarker(data) {
|
||||
if (data.speed != null) { data.length = data.speed * 50; } // and a speed
|
||||
if (data.length != null) {
|
||||
if (polygons[data.name] != null) { map.removeLayer(polygons[data.name]); }
|
||||
var x = data.lon * 1; // X coordinate
|
||||
var y = data.lat * 1; // Y coordinate
|
||||
var ll1 = new L.LatLng(y,x);
|
||||
var x = ll.lng; // X coordinate
|
||||
var y = ll.lat * 1; // Y coordinate
|
||||
var ll1 = ll;
|
||||
var angle = data.bearing * 1;
|
||||
var lengthAsDegrees = data.length / 110540; // metres in a degree..ish
|
||||
var polygon = null;
|
||||
@ -916,6 +925,14 @@ function doCommand(cmd) {
|
||||
if (cmd.hasOwnProperty("lat")) { clat = cmd.lat; }
|
||||
if (cmd.hasOwnProperty("lon")) { clon = cmd.lon; }
|
||||
if (cmd.hasOwnProperty("zoom")) { czoom = cmd.zoom; }
|
||||
if (cmd.hasOwnProperty("cluster")) {
|
||||
document.getElementById("setclus").value = cmd.cluster;
|
||||
setCluster();
|
||||
}
|
||||
if (cmd.hasOwnProperty("maxage")) {
|
||||
document.getElementById("maxage").value = cmd.maxage;
|
||||
setMaxAge();
|
||||
}
|
||||
map.setView([clat,clon],czoom);
|
||||
}
|
||||
</script>
|
||||
|
File diff suppressed because one or more lines are too long
@ -1,5 +1,5 @@
|
||||
CACHE MANIFEST
|
||||
# date: Jun 12th v1.0.12
|
||||
# date: Jun 14th v1.0.13
|
||||
|
||||
CACHE:
|
||||
index.html
|
||||
|
Loading…
Reference in New Issue
Block a user