Worldmap exercise (add POI)

A little bit more advanced way to use worldmap.

Features:

  • Center map
  • Test POI
  • UI for adding own POIs

Look comments and open new tabs/browser window to look map at the same time.

[{"id":"9d0b3c5b.08beb","type":"ui_tab","name":"Home","icon":"dashboard","order":"1"},{"id":"8121855.018af78","type":"websocket-listener","path":"/ws/worldmap","wholemsg":"false"},{"id":"51100e2e.29241","type":"worldmap","name":"","x":726.9999847412109,"y":274.00001525878906,"z":"a8f49670.d5fc08","wires":[]},{"id":"db3c792a.40f0b8","type":"inject","name":"Add test POI","topic":"","payload":"","payloadType":"str","repeat":"","crontab":"","once":true,"x":150,"y":220,"z":"a8f49670.d5fc08","wires":[["600727dc.35b7d8"]]},{"id":"65c65456.04d1ec","type":"websocket out","name":"","server":"8121855.018af78","client":"","x":758.9999847412109,"y":218,"z":"a8f49670.d5fc08","wires":[]},{"id":"600727dc.35b7d8","type":"function","name":"Add test POI","func":"var thing = {\n    name:\"Test POI: car\", \n    lat:61.45, \n    lon:23.859,\n    icon:\"university\",\n    iconColor:\"red\",\n    extrainfo:\"Some extra information\"\n};\nmsg.payload = thing;\nreturn msg;","outputs":1,"noerr":0,"x":340,"y":220,"z":"a8f49670.d5fc08","wires":[["65c65456.04d1ec"]]},{"id":"54ae7eea.a705b","type":"comment","name":"Simple map - localhost:1880/worldmap","info":"Adds a map at http://(your-server-ip):1880/worldmap. \n\nThe `function` node creates an object with some basic properties required to add to a map.","x":266,"y":177,"z":"a8f49670.d5fc08","wires":[]},{"id":"66ff740d.01a2ac","type":"function","name":"Hervanta","func":"msg.payload={};\nmsg.payload.command =  {\n     layer:\"OSM\",  \n     lat:61.45, \n     lon:23.85,\n     zoom:16\n};\nreturn msg;","outputs":1,"noerr":0,"x":578.8957977294922,"y":116.88888549804688,"z":"a8f49670.d5fc08","wires":[["65c65456.04d1ec"]]},{"id":"e1ad12d6.fb23a","type":"inject","name":"Map center to Hervanta","topic":"","payload":"","payloadType":"str","repeat":"","crontab":"","once":true,"x":397.89581298828125,"y":118.88888549804688,"z":"a8f49670.d5fc08","wires":[["66ff740d.01a2ac"]]},{"id":"216928f7.5f7148","type":"ui_button","tab":"9d0b3c5b.08beb","name":"Add POI (edit each field, add 0)","payload":"\"add\"","topic":"add","group":"Location","order":"4","x":187.89578247070312,"y":467.8889617919922,"z":"a8f49670.d5fc08","wires":[["b34d98ef.529468"]]},{"id":"4fcb45d.d08b5bc","type":"ui_text_input","tab":"9d0b3c5b.08beb","mode":"text","delay":300,"name":"lat","topic":"lat","group":"Location","order":"3","x":291.8957824707031,"y":335.88893127441406,"z":"a8f49670.d5fc08","wires":[["b34d98ef.529468"]]},{"id":"632ccad7.8564d4","type":"ui_text_input","tab":"9d0b3c5b.08beb","mode":"text","delay":300,"name":"lon","topic":"lon","group":"Location","order":"2","x":289.8957977294922,"y":375.88893127441406,"z":"a8f49670.d5fc08","wires":[["b34d98ef.529468"]]},{"id":"71ac79b7.3e7f58","type":"ui_text_input","tab":"9d0b3c5b.08beb","mode":"text","delay":300,"name":"name","topic":"name","group":"Location","order":1,"x":289.8957977294922,"y":411.88893127441406,"z":"a8f49670.d5fc08","wires":[["b34d98ef.529468"]]},{"id":"eeae008f.9c713","type":"inject","name":"","topic":"","payload":"POI","payloadType":"string","repeat":"","crontab":"","once":true,"x":134.89581298828125,"y":416.8889065848458,"z":"a8f49670.d5fc08","wires":[["71ac79b7.3e7f58"]]},{"id":"698e8856.98f3e8","type":"inject","name":"","topic":"","payload":"61.45","payloadType":"string","repeat":"","crontab":"","once":true,"x":127.89581298828125,"y":333.8889465332031,"z":"a8f49670.d5fc08","wires":[["4fcb45d.d08b5bc"]]},{"id":"43405874.d88a08","type":"inject","name":"","topic":"","payload":"23.8555","payloadType":"string","repeat":"","crontab":"","once":true,"x":127.89581298828125,"y":378.8889465332031,"z":"a8f49670.d5fc08","wires":[["632ccad7.8564d4"]]},{"id":"b34d98ef.529468","type":"function","name":"Add POI","func":"if (msg.topic==\"name\") {\n    context.name=msg.payload;\n}\nif (msg.topic==\"lon\") {\n    context.lon=msg.payload;\n}\nif (msg.topic==\"lat\") {\n    context.lat=msg.payload;\n}\nif (msg.topic==\"add\") {\n    var thing = {\n        name:context.name, \n        lat:context.lat, \n        lon:context.lon,\n        icon:\"star\",\n        iconColor:\"yellow\",\n        extrainfo:\"User POI\"\n    };\n    msg.payload = thing;\n    return msg;\n}","outputs":1,"noerr":0,"x":563.8957977294922,"y":406.44447326660156,"z":"a8f49670.d5fc08","wires":[["65c65456.04d1ec","54f06e2e.6b26e"]]},{"id":"54f06e2e.6b26e","type":"debug","name":"Debug info","active":true,"console":"false","complete":"true","x":725.8957977294922,"y":404.4445037841797,"z":"a8f49670.d5fc08","wires":[]},{"id":"7adc772f.d6c9b8","type":"comment","name":"Add POI - localhost:1880/ui","info":"NOTE:\nnpm install node-red-contrib-ui\n","x":223.8958282470703,"y":290.4444580078125,"z":"a8f49670.d5fc08","wires":[]},{"id":"b904d01.8d8cd3","type":"comment","name":"Auto center","info":"","x":442.89581298828125,"y":77.44444274902344,"z":"a8f49670.d5fc08","wires":[]}]
mikakaraila

Flow Info

created 1 year, 10 months ago

Node Types

Core
  • comment (x3)
  • debug (x1)
  • function (x3)
  • inject (x5)
  • websocket out (x1)
  • websocket-listener (x1)
Other
  • ui_button (x1)
  • ui_tab (x1)
  • ui_text_input (x3)
  • worldmap (x1)

Tags

  • node-red-contrib-web-worldmap
  • node-red-contrib-ui
  • iot
  • POI
  • map
Copy this flow JSON to your clipboard and then import into Node-RED using the Import From > Clipboard (Ctrl-I) menu option