# Draw a line in nodered-world-map

**URL:** <https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253>\
**Category:** Dashboard\
**Created:** [27 January 2023 13:03 UTC](https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253 "2023-01-27T13:03:41Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![Henjoe](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/henjoe/32/52335_2.png) [@Henjoe](https://discourse.nodered.org/u/Henjoe)\
**Post date:** [27 January 2023 13:03 UTC](https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253/1 "2023-01-27T13:03:41Z")

</div>

Hi nodered experts,

Is there an easier version on how to draw a "link" or a line to world-map dashboard?  
similar to this:

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/1/d/1d4b9ae6ceee67f98a17bfa0c99491973700169b.jpeg)

If this is not possible, and I need to hard coded all the "linked" devices manually, then any suggestion to make easier is highly appreciated.

Thanks!

Regards,  
Henjoe

---

<div class="post-metadata">

**Author:** ![marcus-j-davies](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/marcus-j-davies/32/103435_2.png) [@marcus-j-davies](https://discourse.nodered.org/u/marcus-j-davies)\
**Post date:** [27 January 2023 13:46 UTC](https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253/2 "2023-01-27T13:46:25Z")

</div>

Hi @Henjoe

I'm no expert at dashboard, but this sounds like something the SVG node is for? by @BartButenaers

> **[node-red-contrib-ui-svg](https://flows.nodered.org/node/node-red-contrib-ui-svg)**
>
> A Node-RED widget node to show interactive SVG (vector graphics) in the dashboard

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [27 January 2023 14:02 UTC](https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253/3 "2023-01-27T14:02:58Z")

</div>

Hi, I'm not quite sure what you are asking for, but you can add lines as per the docs [https://flows.nodered.org/node/node-red-contrib-web-worldmap](https://flows.nodered.org/node/node-red-contrib-web-worldmap).  
If you are recording movement then the tracks node may be able to capture the points needed.

---

<div class="post-metadata">

**Author:** ![Henjoe](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/henjoe/32/52335_2.png) [@Henjoe](https://discourse.nodered.org/u/Henjoe)\
**Post date:** [27 January 2023 15:07 UTC](https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253/4 "2023-01-27T15:07:14Z")

</div>

Hi @dceejay how track node works? Do we have sample sample flow to use this?  
I think that's what I need, basically I want to create "pipelines" for water distribution network, however, hardcoding all those "pipes" in a map is a bunch of work. I need something that simply just draw a line from the world map and animate it via "hardcoding".

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [27 January 2023 15:52 UTC](https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253/5 "2023-01-27T15:52:59Z")

</div>

Ah no - the tracks node is more for tracking (say) a car or phone as it moves... If you want to draw lines then the `drawing layer` is probably more useful. If you use that to draw a layer - and add a worldmap in node set to watch for drawing events - when you draw a line you should get a set of points back that you caould save and replay whenever you need it.

---

<div class="post-metadata">

**Author:** ![Henjoe](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/henjoe/32/52335_2.png) [@Henjoe](https://discourse.nodered.org/u/Henjoe)\
**Post date:** [29 January 2023 13:38 UTC](https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253/6 "2023-01-29T13:38:08Z")

</div>

Hi @dceejay thanks for the information, I will look on this.

Upon searching I also found this tool [geojson.io](http://geojson.io) that allows you draw (lines, circle, polygons and arcs) and automatically create a geojson file for you, you can then feed this geojson to worldmap panel and it works fine.

Here is a sample: (geojson was created in [geojson.io](http://geojson.io) then fed in worldmap node)

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/f/d/fda81ab8553f0af85b95710f8cbf08b15adbe106.jpeg)

However, I am actually afraid for it's scalability and performance specially when getting "real-time" live data from sensors, supposed I have 10,000 of sensors and feeding in here in the geojson file could make the performance slow.  
Other point I noticed:

1. I cannot customized icon in the geojson of type "point" while the node-red-map it allows it by just using payload = {icon: "your icon"}
2. I tried to load almost 325Mb size of Geojson file and it crashed the system (lol).

Any thoughts of this? @dceejay

Thanks and regards,  
Henjoe

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [29 January 2023 15:02 UTC](https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253/7 "2023-01-29T15:02:51Z")

</div>

1. I think if you add a "marker-symbol" property to each feature (as per Mapbox spec - [https://github.com/mapbox/simplestyle-spec/tree/master/1.1.0`](https://github.com/mapbox/simplestyle-spec/tree/master/1.1.0%60) ) - but using the Font Awesome 4.7 icon names then you should be able to customise the markers. (and also "marker-color" )

2. yeah - well - need more memory dedicated to Node-RED 🙂 ... I would think you would be better having your geojson somehow split into sections (eld in some sort of store/db) - that can be loaded only when needed - eg when in the view window - and at a certain zoom level.

---

<div class="post-metadata">

**Author:** ![tve](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/tve/32/59475_2.png) [@tve](https://discourse.nodered.org/u/tve)\
**Post date:** [29 January 2023 16:03 UTC](https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253/8 "2023-01-29T16:03:01Z")

</div>

From the pop-up in the geojson sample I wonder whether you have a ton of metadata associated with each line. If so, strip that for the stuff you load into the world map. You have to keep the data in the worldmap minimal. If you want to display additional data when the user clicks on a line, then use a "line\_id" or similar identifier to query a database and retrieve the extra data from there.

---

<div class="post-metadata">

**Author:** ![Henjoe](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/henjoe/32/52335_2.png) [@Henjoe](https://discourse.nodered.org/u/Henjoe)\
**Post date:** [29 January 2023 23:17 UTC](https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253/9 "2023-01-29T23:17:51Z")

</div>

Thanks for confirmation, I am thinking the same too to have it split in a section 🙂

Regards,  
Henjoe

---

<div class="post-metadata">

**Author:** ![Henjoe](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/henjoe/32/52335_2.png) [@Henjoe](https://discourse.nodered.org/u/Henjoe)\
**Post date:** [29 January 2023 23:19 UTC](https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253/10 "2023-01-29T23:19:59Z")

</div>

Hi @tve , thanks for suggesting, I am actually new in worlmap node, how does metadata works in relation to geojson?

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [28 February 2023 23:20 UTC](https://discourse.nodered.org/t/draw-a-line-in-nodered-world-map/74253/11 "2023-02-28T23:20:30Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.