# Color Nodes by Device Address in Gateway Traffic

**URL:** <https://www.thethingsnetwork.org/forum/t/color-nodes-by-device-address-in-gateway-traffic/11542>\
**Category:** Forum Feedback\
**Created:** [January 4, 2018, 4:38pm UTC](https://www.thethingsnetwork.org/forum/t/color-nodes-by-device-address-in-gateway-traffic/11542 "2018-01-04T16:38:34Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![DannyE](https://www.thethingsnetwork.org/forum/user_avatar/www.thethingsnetwork.org/dannye/32/42258_2.png) [@DannyE](https://www.thethingsnetwork.org/forum/u/DannyE)\
**Post date:** [January 4, 2018, 4:38pm UTC](https://www.thethingsnetwork.org/forum/t/color-nodes-by-device-address-in-gateway-traffic/11542/1 "2018-01-04T16:38:34Z")

</div>

Suggestion for the Gateway Traffic log:

With the Device Address added as data-attribute on the LI tag

- ![](https://www.thethingsnetwork.org/forum/uploads/default/original/2X/8/8fd2de7d4bd9d38494d1727824a5b2f5aeac25f9.jpg)

We could use simple CSS (Using the Stylish extension, or any of the dozen CSS extensions)

- ![](https://www.thethingsnetwork.org/forum/uploads/default/original/2X/6/6bfccdbb5f7b968199c66b493934c35484f94a90.jpg)

To style the page, showing my own Nodes and “foreign” Nodes

- ![](https://www.thethingsnetwork.org/forum/uploads/default/original/2X/d/dec6b916be3c666c4fab489791ae16222d23af9f.jpg)

While the team adds this; maybe add Airtime and payload size as data-attributes on the LI tag as well, then CSS can be used to filter out anomalies.

More advanced would be to add Color as Device metadata (same CSS selectors can be created by TTN then)

I now run a (setInterval) monkey script to stick the data-attribute on every new LI

```auto
[...document.querySelectorAll('li:not([data-deviceaddress]) span[class=""]')]
   .map((span)=>{
         var LI=span.parentNode.parentNode.parentNode.parentNode.parentNode;
         LI.setAttribute("data-deviceaddress",span.innerText);
   });

```

and the above CSS in a Stylish script

---

<div class="post-metadata">

**Author:** ![BoRRoZ](https://www.thethingsnetwork.org/forum/user_avatar/www.thethingsnetwork.org/borroz/32/44234_2.png) [@BoRRoZ](https://www.thethingsnetwork.org/forum/u/BoRRoZ)\
**Post date:** [January 4, 2018, 4:40pm UTC](https://www.thethingsnetwork.org/forum/t/color-nodes-by-device-address-in-gateway-traffic/11542/2 "2018-01-04T16:40:45Z")

</div>

like the idea 🕶

---

<div class="post-metadata">

**Author:** ![bluejedi](https://www.thethingsnetwork.org/forum/user_avatar/www.thethingsnetwork.org/bluejedi/32/44639_2.png) [@bluejedi](https://www.thethingsnetwork.org/forum/u/bluejedi)\
**Post date:** [January 4, 2018, 11:33pm UTC](https://www.thethingsnetwork.org/forum/t/color-nodes-by-device-address-in-gateway-traffic/11542/4 "2018-01-04T23:33:14Z")

</div>

> [@DannyE](#):
>
> Suggestion for the Gateway Traffic log:

But soft background colors please that are easy on the eye. 🙂  
(Not hard primary colors that make it more difficult to read the text).

---

<div class="post-metadata">

**Author:** ![bluejedi](https://www.thethingsnetwork.org/forum/user_avatar/www.thethingsnetwork.org/bluejedi/32/44639_2.png) [@bluejedi](https://www.thethingsnetwork.org/forum/u/bluejedi)\
**Post date:** [January 4, 2018, 11:35pm UTC](https://www.thethingsnetwork.org/forum/t/color-nodes-by-device-address-in-gateway-traffic/11542/5 "2018-01-04T23:35:55Z")

</div>

A little more use of ‘responsive design’ would also be welcome.  
Only 40% of my browser width is used (when I maximize it) for showing traffic which is a lot of unused screen estate.

Using more width would also allow to add RSSI and SNR to the first line so they can be read at a glance without having to unfold the contents first.

---

<div class="post-metadata">

**Author:** ![DannyE](https://www.thethingsnetwork.org/forum/user_avatar/www.thethingsnetwork.org/dannye/32/42258_2.png) [@DannyE](https://www.thethingsnetwork.org/forum/u/DannyE)\
**Post date:** [January 9, 2018, 12:41pm UTC](https://www.thethingsnetwork.org/forum/t/color-nodes-by-device-address-in-gateway-traffic/11542/6 "2018-01-09T12:41:37Z")

</div>

![](https://www.thethingsnetwork.org/forum/uploads/default/original/2X/3/3c0c022973303d9940cd0adb9e43bb50e56c3632.png)

The above (using Device Address) breaks because that Device Address is dynamic…

---

<div class="post-metadata">

**Author:** ![arjanvanb](https://www.thethingsnetwork.org/forum/user_avatar/www.thethingsnetwork.org/arjanvanb/32/46626_2.png) [@arjanvanb](https://www.thethingsnetwork.org/forum/u/arjanvanb)\
**Post date:** [January 9, 2018, 6:09pm UTC](https://www.thethingsnetwork.org/forum/t/color-nodes-by-device-address-in-gateway-traffic/11542/7 "2018-01-09T18:09:58Z")

</div>

> [@DannyE](#):
>
> Using the Stylish extension, or any of the dozen CSS extensions

When using an extension for that, one could also use some Greasemonkey script to find the elements, without TTN making any changes. But then one’d still need to configure the list of DevAddr’s one’s interested in. (Assuming that’s what the “aha moment” was about?)

As an aside: note that the search box on top already allows for filtering a single DevAddr.

---

<div class="post-metadata">

**Author:** ![DannyE](https://www.thethingsnetwork.org/forum/user_avatar/www.thethingsnetwork.org/dannye/32/42258_2.png) [@DannyE](https://www.thethingsnetwork.org/forum/u/DannyE)\
**Post date:** [January 9, 2018, 6:22pm UTC](https://www.thethingsnetwork.org/forum/t/color-nodes-by-device-address-in-gateway-traffic/11542/8 "2018-01-09T18:22:08Z")

</div>

(I haven’t yet finished week 1 of the online course)

What is the point of that Device **Address**? (replacing the batteries causes a new Address)

If this list item gets the Device **EUI** all is good

---

<div class="post-metadata">

**Author:** ![arjanvanb](https://www.thethingsnetwork.org/forum/user_avatar/www.thethingsnetwork.org/arjanvanb/32/46626_2.png) [@arjanvanb](https://www.thethingsnetwork.org/forum/u/arjanvanb)\
**Post date:** [January 9, 2018, 6:24pm UTC](https://www.thethingsnetwork.org/forum/t/color-nodes-by-device-address-in-gateway-traffic/11542/9 "2018-01-09T18:24:35Z")

</div>

> [@DannyE](#):
>
> What is the point of that DeviceAddress ? (replacing the batteries causes a new Address)

See [https://www.thethingsnetwork.org/wiki/LoRaWAN/Address-Space](https://www.thethingsnetwork.org/wiki/LoRaWAN/Address-Space)

> [@DannyE](#):
>
> replacing the batteries causes a new Address

Then you’re using OTAA, which is good but indeed the address will change.

> [@DannyE](#):
>
> If this list item gets the DeviceEUI all is good

I doubt TTN will do that, as the gateway does not know anything about that. So far, the gateway’s Traffic page merely shows the unencrypted parts of the LoRaWAN packet, and gateway meta data, just like a gateway’s log could show you. (Plus debug info in the trace…)

---

<div class="post-metadata">

**Author:** ![DannyE](https://www.thethingsnetwork.org/forum/user_avatar/www.thethingsnetwork.org/dannye/32/42258_2.png) [@DannyE](https://www.thethingsnetwork.org/forum/u/DannyE)\
**Post date:** [January 9, 2018, 6:42pm UTC](https://www.thethingsnetwork.org/forum/t/color-nodes-by-device-address-in-gateway-traffic/11542/10 "2018-01-09T18:42:33Z")

</div>

Got it,

I’ll see if I can extend my current Monkey script (which already extracts Application and Device info)

---

<div class="post-metadata">

**Author:** ![JasonHS](https://www.thethingsnetwork.org/forum/user_avatar/www.thethingsnetwork.org/jasonhs/32/34247_2.png) [@JasonHS](https://www.thethingsnetwork.org/forum/u/JasonHS)\
**Post date:** [September 9, 2020, 6:03am UTC](https://www.thethingsnetwork.org/forum/t/color-nodes-by-device-address-in-gateway-traffic/11542/11 "2020-09-09T06:03:02Z")

</div>

Great idea!
