Hello, everyone! I'm starting in node-red and trying to load the msg.payload data inside the apex chart, but to no avail. Grateful index.html <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta…

[image] jonatanallan2k11: but I can't adjust the sizes to 100% I dont know .. using a modern browser like Chrome or Firefox, inspect with its developer tools the html to see what is constraining it. Is it the iframe size ? From the original code you shared try to remove the <b-container id=…

Hello Jônatan, Would it be possible to also share a sample message of the data that you are trying to plot with Apexchart ? If you wire an Inject node to your uibuilder node with a msg.payload for example [ { "x": "02-10-2017 GMT", "y": 34 }, { "x": "02-11-2017…

@UnborN . grateful for the willingness I want to get only one given and then get the moisture {"STAMP":"2021-12-02 15:08:17","TEMPERATURA":22.79,"UMIDADE":38.66} [Sem título] The graph looks like this [image]

You need to restructure your data to match what the Apexchart expects Here is an example of how you could do it with Javascript in a Function node [{"id":"8f698af8e2d11e60","type":"inject","z":"54efb553244c241f","name":"data","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab"…

series: [{ name: "Temperatura", data: [], }], Does that stretch still keep it?

Thank you very much for the reply, I will explore further the resources from now on

[image] jonatanallan2k11: series: [{ name: "Temperatura", data: [], }], Does that stretch still keep it? you could define series in the Vue data as an empty array initially series: [], the actual values are assigned when you receive the msg from No…

That's what I did and it worked :slight_smile:

not that i know of ... uibuilder has its own node .. it creates its own url endpoints and its own logic to accept messages.

Node-RED

Node-RED Forum

How to load date[] from the Apex chart with msg.payload?

Dashboard

jonatanallan2k11 15 December 2021 18:20 9

If I put the index.html and the index.js within a ui_template, will it work the same way?

Topic		Replies	Views
Load data to chart in uibuilder General	4	1000	12 May 2020
Examples using Apexcharts with uibuilder Dashboard uibuilder	5	534	19 October 2022
Node-red UIbuilder Vue APEXCHARTS General uibuilder	9	450	19 February 2023
Uibuilder add Apex chart bar General	5	574	18 July 2021
Uibuilder v2 Charting Examples Share Your Projects uibuilder	29	6206	17 September 2022

Copyright OpenJS Foundation and Node-RED contributors. All rights reserved. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trademarks are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.

How to load date[] from the Apex chart with msg.payload?

Related topics