# ✨ FlexDash alpha release - round 3

**URL:** <https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562>\
**Category:** Dashboard\
**Tags:** flexdash\
**Created:** [22 December 2022 02:36 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562 "2022-12-22T02:36:09Z")\
**Posts on this page:** 20\
**Page:** 2

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [27 December 2022 16:22 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/21 "2022-12-27T16:22:15Z")

</div>

The tooltip box is supposed to swing to the left and right mid way across the screen.  
It's to ensure that the box is always visible when the points are close to the edges of the chart.

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [27 December 2022 16:40 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/22 "2022-12-27T16:40:57Z")

</div>

Makes sense, but i didn't raise it as an issue, just thought this information (that there are only two points shown in tooltip, one extreme left and one extreme right) would give some help in trying to understand what is the issue.

---

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [27 December 2022 16:49 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/23 "2022-12-27T16:49:55Z")

</div>

I realise it's not helping with your problem, but I'm running the same versions as you on a pi, and same browser, and it works fine here.

![cursor](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/2/6/2641853cc58755a569de690fd6c6f4c6fdcb954e.gif)

---

<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:** [27 December 2022 16:55 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/24 "2022-12-27T16:55:28Z")

</div>

This is odd... What version of FlexDash are you running, it's shown in the very top right corner. Also, please have a look at the browser console and paste any warnings/errors that may be there.

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [27 December 2022 17:00 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/25 "2022-12-27T17:00:42Z")

</div>

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/5/c/5c5e31872bc5686f0a6b44805210f7337e9ecfa8.png)

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/a/8/a80d6a66dd964aab171e64811a3610199c143ccc.png)

---

<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:** [27 December 2022 17:03 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/26 "2022-12-27T17:03:51Z")

</div>

> [@tve](#):
>
> Also, please have a look at the browser console and paste any warnings/errors that may be there.

... ... ...

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [27 December 2022 17:06 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/27 "2022-12-27T17:06:11Z")

</div>

only showing one issue no warning

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/f/8/f838782204e939fb6b2fa69db296bc053adadd9e.png)

```auto

1. A page or script is accessing at least one of `navigator.userAgent`, `navigator.appVersion`, and `navigator.platform`. Starting in Chrome 101, the amount of information available in the User Agent string will be reduced.

To fix this issue, replace the usage of `navigator.userAgent`, `navigator.appVersion`, and `navigator.platform` with feature detection, progressive enhancement, or migrate to `navigator.userAgentData`.

Note that for performance reasons, only the first access to one of the properties is shown.

2. AFFECTED RESOURCES

  1. 1 source

    1. index.a23dd9ed.js:1

```

---

<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:** [27 December 2022 17:07 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/28 "2022-12-27T17:07:47Z")

</div>

Another question is whether this only happens for this plot or for all plots. E.g. if you import one of the demo plots or someone else's samples does it show as well?  
If it does, if you disable your plot (disable the node at the bottom of its edit page) does it still show on other plots?  
If it doesn't, can you paste a sample flow to reproduce, or a full capture of the messages sent to the plot?

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [27 December 2022 17:16 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/29 "2022-12-27T17:16:24Z")

</div>

Its only with my example. Demo flow is working good.

![timeplot2](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/3/c/3c772c7963daa28de4e94d709d4998f952bf418f.gif)

---

<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:** [27 December 2022 17:18 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/30 "2022-12-27T17:18:50Z")

</div>

Then I would assume that it has to do with the data you feed into the plot. If you could somehow post that, that would be great. E.g. either an inject node into which you paste the message you gather using a debug node or the raw message(s). I'm wondering whether there's some value there that causes issues or some combination of settings. Hmmm, a repro using an inject node and your plot node would be ideal.

(I'm not saying it's the fault of the data, the tooltip shouldn't do that..)

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [27 December 2022 17:28 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/31 "2022-12-27T17:28:27Z")

</div>

I have copied the results of mysql query and pasted into an inject node then i do conversion of the data with a change node to FD input format, hope this helps.

```auto
[{"id":"9e8e0553e01aa7d6","type":"fd-time-plot","z":"1543d308b342690a","fd_container":"69c2e3f5798c3475","fd_cols":9,"fd_rows":"4","fd_array":false,"fd_array_max":10,"name":"","title":"Time Plot","popup_info":"","data":"","labels":[],"colors":[],"axes":[],"widths":[],"span_gaps":[],"left_unit":"","left_min":null,"left_max":null,"left_decimals":1,"left_isoprefix":false,"left_log":false,"right_unit":"","right_min":null,"right_max":null,"right_decimals":1,"right_isoprefix":false,"right_log":false,"reverse_legend":false,"x":780,"y":660,"wires":[]},{"id":"3a18573ece57e995","type":"inject","z":"1543d308b342690a","name":"sample plot","props":[{"p":"payload"},{"p":"widths","v":"[2,2]","vt":"json"},{"p":"span_gaps","v":"[true,true]","vt":"json"},{"p":"colors","v":"[\"green\",\"red\"]","vt":"json"},{"p":"labels","v":"[\"PPM\",\"Temperature\"]","vt":"str"},{"p":"limit","v":"1440","vt":"str"}],"repeat":"","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"[{\"Time\":1672161840,\"m\":0,\"temp\":84.9},{\"Time\":1672161780,\"m\":0,\"temp\":85.2},{\"Time\":1672161720,\"m\":0,\"temp\":86.4},{\"Time\":1672161660,\"m\":0,\"temp\":86.7},{\"Time\":1672161600,\"m\":0,\"temp\":87},{\"Time\":1672161540,\"m\":0,\"temp\":87},{\"Time\":1672161480,\"m\":0,\"temp\":87.6},{\"Time\":1672161420,\"m\":9,\"temp\":88.2},{\"Time\":1672161360,\"m\":9,\"temp\":89.4},{\"Time\":1672161300,\"m\":8,\"temp\":94.8},{\"Time\":1672161240,\"m\":9,\"temp\":96.3},{\"Time\":1672161180,\"m\":9,\"temp\":95.4},{\"Time\":1672161120,\"m\":8,\"temp\":94.8},{\"Time\":1672161060,\"m\":3,\"temp\":93.9},{\"Time\":1672161000,\"m\":0,\"temp\":73.8},{\"Time\":1672160940,\"m\":0,\"temp\":74.7},{\"Time\":1672160880,\"m\":0,\"temp\":75.6},{\"Time\":1672160820,\"m\":0,\"temp\":76.5},{\"Time\":1672160760,\"m\":0,\"temp\":77.4},{\"Time\":1672160700,\"m\":0,\"temp\":77.7},{\"Time\":1672160643,\"m\":0,\"temp\":79.2},{\"Time\":1672160583,\"m\":0,\"temp\":79.8},{\"Time\":1672160520,\"m\":0,\"temp\":80.4},{\"Time\":1672160460,\"m\":0,\"temp\":81},{\"Time\":1672160400,\"m\":0,\"temp\":81.9},{\"Time\":1672160340,\"m\":0,\"temp\":83.1},{\"Time\":1672160280,\"m\":0,\"temp\":83.1},{\"Time\":1672160220,\"m\":0,\"temp\":83.7},{\"Time\":1672160160,\"m\":0,\"temp\":84.9},{\"Time\":1672160100,\"m\":0,\"temp\":86.1}]","payloadType":"json","x":290,"y":660,"wires":[["cf52d104a3ab9f9a"]]},{"id":"cf52d104a3ab9f9a","type":"change","z":"1543d308b342690a","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"$$.payload.[$.*]","tot":"jsonata"}],"action":"","property":"","from":"","to":"","reg":false,"x":500,"y":660,"wires":[["9e8e0553e01aa7d6"]]},{"id":"69c2e3f5798c3475","type":"flexdash container","name":"Demo grid","kind":"StdGrid","fd_children":",97e34cb72c2f36bd,9a180f1ef444158f,9e8e0553e01aa7d6,3fe1da77bb1eba36,7e5af03cd7a62a33","title":"","tab":"fef6c0f6d48841d6","min_cols":"1","max_cols":"6","parent":"","solid":false,"cols":"1","rows":"1"},{"id":"fef6c0f6d48841d6","type":"flexdash tab","name":"Demo","icon":"mdi-view-dashboard","fd_children":",69c2e3f5798c3475","fd":"e8f5aea52ab49500"}]

```

---

<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:** [27 December 2022 18:00 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/32 "2022-12-27T18:00:33Z")

</div>

I can repro and there's the warning in the console:

```nohighlight
Warning: for TimePlot failed to type-cast prop 'data': Error: cannot convert JSON value to Array

```

I'll have to look at it later, have some errands to run now...  
Thanks for the repro!

---

<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:** [27 December 2022 18:10 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/33 "2022-12-27T18:10:05Z")

</div>

Your problem is the msg.label prop:  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/e/9eb6de8c24a7fe81129a635803fe177efc52df78.png)

Add a debug node to your flow and inspect the message:

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/d/9/d966f3a3b77a3a54f8c1a2c2a098fdf5e6e2822f.png)

I need to show that warning in FD somewhere...?

---

<div class="post-metadata">

**Author:** ![rko](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/rko/32/45807_2.png) [@rko](https://discourse.nodered.org/u/rko)\
**Post date:** [27 December 2022 22:43 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/34 "2022-12-27T22:43:29Z")

</div>

Just got started with fd, so bear with me. I wanted to test the time series but running into an error after importing it from the samples:

```auto
TimePlotRaw: data must be an array of rows (arrays)

```

Node-RED: 3.0.2  
Node: 16.x

---

<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:** [27 December 2022 23:08 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/35 "2022-12-27T23:08:55Z")

</div>

> [@rko](#):
>
> `TimePlotRaw: data must be an array of rows (arrays)`

A couple of suggestions:

- read the help provided with the TimePlot node, I know it's not the easiest to digest prose, so...
- look at the messages used in the demos
- post either your message or the test flow you're using here so we can see what you're trying to do and suggest how you might fix it

---

<div class="post-metadata">

**Author:** ![rko](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/rko/32/45807_2.png) [@rko](https://discourse.nodered.org/u/rko)\
**Post date:** [27 December 2022 23:19 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/36 "2022-12-27T23:19:40Z")

</div>

Sorry for not being specific. This sample does not work out of the box on my system:  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/5/c/5c55dabee2d6bd45fe21d5b7a882f49122744947.png)

The _time plot raw_ seems to work.

---

<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:** [27 December 2022 23:29 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/37 "2022-12-27T23:29:08Z")

</div>

> [@rko](#):
>
> This sample does not work out of the box on my system:

Got it, thanks for flagging it!

---

<div class="post-metadata">

**Author:** ![rko](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/rko/32/45807_2.png) [@rko](https://discourse.nodered.org/u/rko)\
**Post date:** [27 December 2022 23:31 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/38 "2022-12-27T23:31:35Z")

</div>

Great work btw! Sorry, I should have mentioned this first 🙈

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [28 December 2022 02:59 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/39 "2022-12-28T02:59:38Z")

</div>

I have added the debug node output of both my sample and your example. i couldn't make out any difference, except that mine has two and your example has 6 series.

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/d/8/d8454c9a07ab24a75e2ec3c69ec4d48b0531e6c4.png)

---

<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:** [28 December 2022 03:28 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562/40 "2022-12-28T03:28:32Z")

</div>

~~Please copy your message from that debug pane and paste here (there's a copy button/icon to the right of the top-level object drop-down)~~

Ooops, the issue is that labels needs to be an array, not a string representation of an array.  
(Not clear to me why "your example" (mine) works)

[Previous page](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562.md?page=1)

[Next page](https://discourse.nodered.org/t/flexdash-alpha-release-round-3/72562.md?page=3)