# Best way to show Grafana in Dashboard?

**URL:** <https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667>\
**Category:** Dashboard\
**Created:** [18 September 2019 16:53 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667 "2019-09-18T16:53:36Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![hazymat](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hazymat/32/108159_2.png) [@hazymat](https://discourse.nodered.org/u/hazymat)\
**Post date:** [18 September 2019 16:53 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/1 "2019-09-18T16:53:36Z")

</div>

Apologies if this has been covered elsewhere but I've seen a lot of articles about getting data out of Node-RED into InfluxDB then visualising that data in Grafana.

But what's the best way to show one of these graphs in Node-RED dashboard?

Presumably I'd need a template node. Is the best way just to insert an iframe?

---

<div class="post-metadata">

**Author:** ![bakman2](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bakman2/32/6207_2.png) [@bakman2](https://discourse.nodered.org/u/bakman2)\
**Post date:** [18 September 2019 17:37 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/2 "2019-09-18T17:37:59Z")

</div>

Yes for both template node+iframe.

From grafana you can export the code directly from a chart.

Note that authentication might give some problems, check the grafana documentation how to enable sharing without login (or without eg cookies)

---

<div class="post-metadata">

**Author:** ![edje11](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/edje11/32/572_2.png) [@edje11](https://discourse.nodered.org/u/edje11)\
**Post date:** [18 September 2019 17:59 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/3 "2019-09-18T17:59:32Z")

</div>

Have a look at this flow [https://flows.nodered.org/flow/8e96b8630c4edc866aa0459354033c9b](https://flows.nodered.org/flow/8e96b8630c4edc866aa0459354033c9b)

---

<div class="post-metadata">

**Author:** ![hazymat](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hazymat/32/108159_2.png) [@hazymat](https://discourse.nodered.org/u/hazymat)\
**Post date:** [18 September 2019 18:12 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/4 "2019-09-18T18:12:15Z")

</div>

Perfect, thank you @edje11 . That was a #googlefail because "show grafana in node red dashboard" did not bring that result up!

---

<div class="post-metadata">

**Author:** ![meeki007](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/meeki007/32/12499_2.png) [@meeki007](https://discourse.nodered.org/u/meeki007)\
**Post date:** [22 September 2019 17:51 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/5 "2019-09-22T17:51:02Z")

</div>

+1 Thanks @edje11 bookmarked for later

---

<div class="post-metadata">

**Author:** ![hazymat](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hazymat/32/108159_2.png) [@hazymat](https://discourse.nodered.org/u/hazymat)\
**Post date:** [17 October 2019 11:33 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/7 "2019-10-17T11:33:17Z")

</div>

> [@msmthng](#):
>
> what is the Buildtemplate node

The Buildtemplate node is a normal function node, see the example posted on that page, it's just the label they gave to the function node

---

<div class="post-metadata">

**Author:** ![msmthng](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/msmthng/32/87616_2.png) [@msmthng](https://discourse.nodered.org/u/msmthng)\
**Post date:** [17 October 2019 11:34 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/8 "2019-10-17T11:34:15Z")

</div>

+1 thanks

---

<div class="post-metadata">

**Author:** ![msmthng](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/msmthng/32/87616_2.png) [@msmthng](https://discourse.nodered.org/u/msmthng)\
**Post date:** [17 October 2019 12:19 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/9 "2019-10-17T12:19:42Z")

</div>

how did you manage to get only the graph from grafana i have the filter and dashboard name as well?

---

<div class="post-metadata">

**Author:** ![edje11](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/edje11/32/572_2.png) [@edje11](https://discourse.nodered.org/u/edje11)\
**Post date:** [17 October 2019 12:27 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/10 "2019-10-17T12:27:21Z")

</div>

Click on the triangle and choose share and then the tab embed. Copy from the share url the part starting with _http:..._ and ends with _orgid=1_ , for example _[http://192.168.1.127:3000/d-solo/0032x0mgk/joshuadashboard?orgId=1](http://192.168.1.127:3000/d-solo/0032x0mgk/joshuadashboard?orgId=1)_  
Copy this part to Build template function.  
Passing this url to a browser should also show the chart only to verify.  
If that's also not working you didn't change the _grafana.ini_ correct or not.

---

<div class="post-metadata">

**Author:** ![msmthng](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/msmthng/32/87616_2.png) [@msmthng](https://discourse.nodered.org/u/msmthng)\
**Post date:** [17 October 2019 12:31 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/11 "2019-10-17T12:31:41Z")

</div>

![2019-10-17_14-29-41](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/0/053c9cba4b3cdb81b65bb2a8950be1557dc3f176.jpeg)

i did, how you did manage to prevent the marked stuff apprearing in dashboard?

solved : &kiosk

---

<div class="post-metadata">

**Author:** ![SuperNinja](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/superninja/32/5761_2.png) [@SuperNinja](https://discourse.nodered.org/u/SuperNinja)\
**Post date:** [18 October 2019 10:56 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/12 "2019-10-18T10:56:26Z")

</div>

Hi @edje11

i test the link :

```auto
http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1
&amp;refresh=1m
&amp;panelId=2

```

This is the result in Chrome :

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/6/64c36ebacf05ae94a8378283e0d4056f258df576.png)

If i change little thing after the **&** :

```auto
http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1
&refresh=1m
&panelId=2

```

it's working :

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

What is the problem with **&**? What do i put instead ?

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [18 October 2019 11:47 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/13 "2019-10-18T11:47:55Z")

</div>

Try doing a google search using `what is &amp;`

---

<div class="post-metadata">

**Author:** ![SuperNinja](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/superninja/32/5761_2.png) [@SuperNinja](https://discourse.nodered.org/u/SuperNinja)\
**Post date:** [18 October 2019 12:56 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/14 "2019-10-18T12:56:49Z")

</div>

> [@zenofmud](#):
>
> `what is &amp; `

it's the html code for the **&** charactere

so I must transform in my Function node an address that has **&** by `&amp;` see @edje11. But this code does not show anything in my dashboard.

if someone see something wrong in :

```auto
[{"id":"98f78289.cab7","type":"ui_template","z":"378c07b4.3c0cd8","group":"aa43db30.ce1298","name":"temp & tds avec test chrome","order":1,"width":3,"height":2,"format":"<iframe style=\"\n width:150px; \n height:65px;\n overflow: hidden;\n margin: auto;\n border: 0px solid green;\n \"\nframeborder=\"0\" scrolling=\"no\" marginheight=\"0\" marginwidth=\"0\"\n\nsrc=\n\"http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\n&amp;refresh=1m\n&amp;panelId=2\" \n\n \n></iframe>\n<!-- \n\"http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\n&amp;refresh=1m\n&amp;panelId=2\" \n\n\nMARCHE PAS dans chrome : \"Panel with id not found\" -->\n \n<!--\nhttp://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\n&refresh=1m\n&panelId=2\n\nMARCHE OK dans Chrome\n-->","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":860,"y":4100,"wires":[[]]},{"id":"ccce1533.c4a478","type":"ui_button","z":"378c07b4.3c0cd8","name":"","group":"aa43db30.ce1298","order":4,"width":2,"height":1,"passthru":true,"label":"24 H","tooltip":"","color":"","bgcolor":"","icon":"","payload":"24","payloadType":"num","topic":"","x":290,"y":4040,"wires":[["8ab52dba.0a72"]]},{"id":"97804d2d.e7399","type":"ui_button","z":"378c07b4.3c0cd8","name":"","group":"aa43db30.ce1298","order":3,"width":2,"height":1,"passthru":false,"label":"12 H","tooltip":"","color":"","bgcolor":"","icon":"","payload":"12","payloadType":"num","topic":"","x":290,"y":4080,"wires":[["8ab52dba.0a72"]]},{"id":"1d67fe8d.35ae21","type":"ui_button","z":"378c07b4.3c0cd8","name":"","group":"aa43db30.ce1298","order":2,"width":2,"height":1,"passthru":false,"label":"1 H","tooltip":"","color":"","bgcolor":"","icon":"","payload":"1","payloadType":"num","topic":"","x":290,"y":4000,"wires":[["8ab52dba.0a72"]]},{"id":"4b186b84.b42234","type":"ui_template","z":"378c07b4.3c0cd8","group":"aa43db30.ce1298","name":"ChartTemperatuur","order":8,"width":0,"height":0,"format":"\n","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":890,"y":4040,"wires":[[]]},{"id":"8ab52dba.0a72","type":"function","z":"378c07b4.3c0cd8","name":"SetTimeRange","func":"var p_30d = 1000*60*60*24*30 ; //30 Days\nvar p_7d = 1000*60*60*24*7 ; //7 Days\nvar p_1d = 1000*60*60*24 ; // 1 Day\nvar p_hr = 1000*60*60; //1 Hour\n\nvar d = new Date();\nvar current = d.getTime();\n\n\nmsg.fromdate = \"now-\" + msg.payload +\"h\";\nmsg.enddate = \"now\";\n\n\nreturn msg;","outputs":1,"noerr":0,"x":520,"y":4040,"wires":[["d1307e21.69815"]]},{"id":"d1307e21.69815","type":"function","z":"378c07b4.3c0cd8","name":"BuildTemplate","func":"panelid=2\n\nmsg.template= \"<iframe \"+\n\n\"style=\\\"width:600px; height:300px; overflow:hidden; margin:auto; border:0px solid green;\\\" \"+ \n\n\"http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\"+\n\"&amp;refresh=1m\"+\n\"&amp;theme=dark\"+\n\"&amp;from=\"+ msg.fromdate +\n\"&amp;to=\"+ msg.enddate +\n\"&amp;panelId=\"+panelid+\"> </iframe>\"\n\n\n\nreturn msg;\n\n/* ORIGINAL\n\"http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\"+\n\"&amp;refresh=1m\"+\n\"&amp;theme=dark\"+\n\"&amp;from=\"+ msg.fromdate +\n\"&amp;to=\"+ msg.enddate +\n\"&amp;panelId=\"+panelid+\"> </iframe>\"\n\n\"http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\"+\n\"%26refresh=5s\"+\n\"%26theme=dark\"+\n\"%26from=\"+ msg.fromdate +\n\"%26to=\"+ msg.enddate +\n\"%26panelId=\"+panelid+\"> </iframe>\"\n\nsort le message : \"Panel with id not found\"\nhttp://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\n&amp;refresh=1m\n&amp;theme=dark\n&amp;from=now-24h\n&amp;to=now\n&amp;panelId=2\n\nhttp://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\n&refresh=1m\n&theme=dark\n&from=now-24h\n&to=now\n&panelId=2\n*/\n\n\n\n/* ORIGINAL\npanelid=2\n\nmsg.template= \"<iframe \"+\n\n\"style=\\\"width:600px; height:300px; overflow:hidden; margin:auto; border:0px solid green;\\\" \"+ \n\n\"src=http://192.168.1.127:3000/d-solo/0032x0mgk/joshuadashboard?orgId=1\"+\n\"&amp;refresh=1m\"+\n\"&amp;theme=dark\"+\n\"&amp;from=\"+ msg.fromdate +\n\"&amp;to=\"+ msg.enddate +\n\"&amp;panelId=\"+panelid+\"> </iframe>\"\n\nreturn msg;\n*/","outputs":1,"noerr":0,"x":700,"y":4040,"wires":[["4b186b84.b42234"]]},{"id":"ff082149.1bb62","type":"function","z":"378c07b4.3c0cd8","name":"SetTimeYesterday","func":"var p_30d = 1000*60*60*24*30 ; //30 Days\nvar p_7d = 1000*60*60*24*7 ; //7 Days\nvar p_1d = 1000*60*60*24 ; // 1 Day\nvar p_hr = 1000*60*60; //1 Hour\n\nvar d = new Date();\nvar current = d.getTime();\nvar today0h = d.setHours(0,0,0,0); //Timestamp midnight\n\nmsg.fromdate = today0h - p_1d\nmsg.enddate = today0h\nreturn msg;","outputs":1,"noerr":0,"x":510,"y":4080,"wires":[["d1307e21.69815"]]},{"id":"839ad95b.c18748","type":"ui_button","z":"378c07b4.3c0cd8","name":"","group":"aa43db30.ce1298","order":5,"width":2,"height":1,"passthru":false,"label":"Yesterday","tooltip":"","color":"","bgcolor":"","icon":"","payload":"yesterday","payloadType":"str","topic":"","x":280,"y":4120,"wires":[["ff082149.1bb62"]]},{"id":"b46bcd92.3dac","type":"ui_template","z":"378c07b4.3c0cd8","group":"aa43db30.ce1298","name":"Page Got Loaded","order":10,"width":0,"height":0,"format":"<script>\n(function() {\n (function(scope) {\n scope.send({payload: \"preload\"}); // this gets sent when the view is opened in the browser\n })(scope);\n})();\n</script>","storeOutMessages":false,"fwdInMessages":false,"templateScope":"local","x":90,"y":4040,"wires":[["ccce1533.c4a478","516d713c.6cd53"]]},{"id":"aa43db30.ce1298","type":"ui_group","z":"","name":"Bathroom","tab":"7605e0c6.2cdf9","order":1,"disp":true,"width":"12","collapse":false},{"id":"7605e0c6.2cdf9","type":"ui_tab","z":"","name":"GrafanaTest","icon":"dashboard","order":37}]

```

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [18 October 2019 13:27 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/15 "2019-10-18T13:27:04Z")

</div>

> Note that replacing `&` with `&amp` ; is only done when writing the URL in HTML, where `"&"` is a special character (along with "\<" and "\>"). When writing the same URL in a plain text email message or in the location bar of your browser, you would use `"&"` and not `"&amp;"` . With HTML, the browser translates `"&amp;"` to `"&"` so the Web server would only see `"&"` and not `"&amp;"` in the query string of the request. from [forms - What is &amp used for - Stack Overflow](https://stackoverflow.com/questions/9084237/what-is-amp-used-for)

---

<div class="post-metadata">

**Author:** ![SuperNinja](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/superninja/32/5761_2.png) [@SuperNinja](https://discourse.nodered.org/u/SuperNinja)\
**Post date:** [18 October 2019 13:40 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/16 "2019-10-18T13:40:27Z")

</div>

thank you for the explanation.  
Ok, the `&` all alone is for an address to type directly in a browser, and `&amp;` to include it in a html code.  
But why, chrome can not display it ? Why the Template node, can not display my Grafana curve?

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/4/428d6d77db4c0693a3898c17daf2a52a6b085b24.png)  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/3/36f62e375ea6e7be708bf48bd7c0a00f698e8aa9.png)

```auto
[{"id":"ccce1533.c4a478","type":"ui_button","z":"378c07b4.3c0cd8","name":"","group":"aa43db30.ce1298","order":4,"width":2,"height":1,"passthru":true,"label":"24 H","tooltip":"","color":"","bgcolor":"","icon":"","payload":"24","payloadType":"num","topic":"","x":290,"y":4040,"wires":[["8ab52dba.0a72"]]},{"id":"97804d2d.e7399","type":"ui_button","z":"378c07b4.3c0cd8","name":"","group":"aa43db30.ce1298","order":3,"width":2,"height":1,"passthru":false,"label":"12 H","tooltip":"","color":"","bgcolor":"","icon":"","payload":"12","payloadType":"num","topic":"","x":290,"y":4080,"wires":[["8ab52dba.0a72"]]},{"id":"1d67fe8d.35ae21","type":"ui_button","z":"378c07b4.3c0cd8","name":"","group":"aa43db30.ce1298","order":2,"width":2,"height":1,"passthru":false,"label":"1 H","tooltip":"","color":"","bgcolor":"","icon":"","payload":"1","payloadType":"num","topic":"","x":290,"y":4000,"wires":[["8ab52dba.0a72"]]},{"id":"4b186b84.b42234","type":"ui_template","z":"378c07b4.3c0cd8","group":"aa43db30.ce1298","name":"ChartTemperatuur","order":8,"width":0,"height":0,"format":"\n","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":890,"y":4040,"wires":[[]]},{"id":"8ab52dba.0a72","type":"function","z":"378c07b4.3c0cd8","name":"SetTimeRange","func":"var p_30d = 1000*60*60*24*30 ; //30 Days\nvar p_7d = 1000*60*60*24*7 ; //7 Days\nvar p_1d = 1000*60*60*24 ; // 1 Day\nvar p_hr = 1000*60*60; //1 Hour\n\nvar d = new Date();\nvar current = d.getTime();\n\n\nmsg.fromdate = \"now-\" + msg.payload +\"h\";\nmsg.enddate = \"now\";\n\n\nreturn msg;","outputs":1,"noerr":0,"x":520,"y":4040,"wires":[["d1307e21.69815"]]},{"id":"d1307e21.69815","type":"function","z":"378c07b4.3c0cd8","name":"BuildTemplate","func":"panelid=2\n\nmsg.template= \"<iframe \"+\n\n\"style=\\\"width:600px; height:300px; overflow:hidden; margin:auto; border:0px solid green;\\\" \"+ \n\n\"http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\"+\n\"&amp;refresh=1m\"+\n\"&amp;theme=dark\"+\n\"&amp;from=\"+ msg.fromdate +\n\"&amp;to=\"+ msg.enddate +\n\"&amp;panelId=\"+panelid+\"> </iframe>\"\n\n\n\nreturn msg;\n\n/* ORIGINAL\n\"http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\"+\n\"&amp;refresh=1m\"+\n\"&amp;theme=dark\"+\n\"&amp;from=\"+ msg.fromdate +\n\"&amp;to=\"+ msg.enddate +\n\"&amp;panelId=\"+panelid+\"> </iframe>\"\n\n\"http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\"+\n\"%26refresh=5s\"+\n\"%26theme=dark\"+\n\"%26from=\"+ msg.fromdate +\n\"%26to=\"+ msg.enddate +\n\"%26panelId=\"+panelid+\"> </iframe>\"\n\nsort le message : \"Panel with id not found\"\nhttp://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\n&amp;refresh=1m\n&amp;theme=dark\n&amp;from=now-24h\n&amp;to=now\n&amp;panelId=2\n\nhttp://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1\n&refresh=1m\n&theme=dark\n&from=now-24h\n&to=now\n&panelId=2\n*/\n\n\n\n/* ORIGINAL\npanelid=2\n\nmsg.template= \"<iframe \"+\n\n\"style=\\\"width:600px; height:300px; overflow:hidden; margin:auto; border:0px solid green;\\\" \"+ \n\n\"src=http://192.168.1.127:3000/d-solo/0032x0mgk/joshuadashboard?orgId=1\"+\n\"&amp;refresh=1m\"+\n\"&amp;theme=dark\"+\n\"&amp;from=\"+ msg.fromdate +\n\"&amp;to=\"+ msg.enddate +\n\"&amp;panelId=\"+panelid+\"> </iframe>\"\n\nreturn msg;\n*/","outputs":1,"noerr":0,"x":700,"y":4040,"wires":[["4b186b84.b42234"]]},{"id":"ff082149.1bb62","type":"function","z":"378c07b4.3c0cd8","name":"SetTimeYesterday","func":"var p_30d = 1000*60*60*24*30 ; //30 Days\nvar p_7d = 1000*60*60*24*7 ; //7 Days\nvar p_1d = 1000*60*60*24 ; // 1 Day\nvar p_hr = 1000*60*60; //1 Hour\n\nvar d = new Date();\nvar current = d.getTime();\nvar today0h = d.setHours(0,0,0,0); //Timestamp midnight\n\nmsg.fromdate = today0h - p_1d\nmsg.enddate = today0h\nreturn msg;","outputs":1,"noerr":0,"x":510,"y":4080,"wires":[["d1307e21.69815"]]},{"id":"839ad95b.c18748","type":"ui_button","z":"378c07b4.3c0cd8","name":"","group":"aa43db30.ce1298","order":5,"width":2,"height":1,"passthru":false,"label":"Yesterday","tooltip":"","color":"","bgcolor":"","icon":"","payload":"yesterday","payloadType":"str","topic":"","x":280,"y":4120,"wires":[["ff082149.1bb62"]]},{"id":"b46bcd92.3dac","type":"ui_template","z":"378c07b4.3c0cd8","group":"aa43db30.ce1298","name":"Page Got Loaded","order":10,"width":0,"height":0,"format":"<script>\n(function() {\n (function(scope) {\n scope.send({payload: \"preload\"}); // this gets sent when the view is opened in the browser\n })(scope);\n})();\n</script>","storeOutMessages":false,"fwdInMessages":false,"templateScope":"local","x":90,"y":4040,"wires":[["ccce1533.c4a478","516d713c.6cd53","98f78289.cab7"]]},{"id":"aa43db30.ce1298","type":"ui_group","z":"","name":"Influx Sensor","tab":"7605e0c6.2cdf9","order":1,"disp":true,"width":"12","collapse":false},{"id":"7605e0c6.2cdf9","type":"ui_tab","z":"","name":"Grafana","icon":"dashboard","order":37,"disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [18 October 2019 14:21 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/17 "2019-10-18T14:21:33Z")

</div>

Use the javascript console tool in the browser to see if there are any errors

---

<div class="post-metadata">

**Author:** ![edje11](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/edje11/32/572_2.png) [@edje11](https://discourse.nodered.org/u/edje11)\
**Post date:** [18 October 2019 14:32 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/18 "2019-10-18T14:32:42Z")

</div>

You should use  
` "src=http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1"+`  
not  
`"http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1"+`

---

<div class="post-metadata">

**Author:** ![SuperNinja](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/superninja/32/5761_2.png) [@SuperNinja](https://discourse.nodered.org/u/SuperNinja)\
**Post date:** [18 October 2019 14:39 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/19 "2019-10-18T14:39:17Z")

</div>

Hi @edje11, thanks for answer

> [@edje11](#):
>
> "src=[http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1](http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1)"+

That's the finaly code :

```auto
panelid=2
msg.template= "<iframe "+
"style=\"width:600px; height:300px; overflow:hidden; margin:auto; border:0px solid green;\" "+ 

"src=http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1"+
"&amp;refresh=1m"+
"&amp;theme=dark"+
"&amp;from="+ msg.fromdate +
"&amp;to="+ msg.enddate +
"&amp;panelId="+panelid+"> </iframe>"

return msg;

```

And the result:

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

This is the Debug message after the Function Node:

```auto
object
payload: 24
socketid: "XuQkg3qIPhYY9E69AAAO"
_msgid: "a6fda227.9b892"
fromdate: "now-24h"
enddate: "now"
template: "<iframe style="width:600px; height:300px; overflow:hidden; margin:auto; border:0px solid green;" src=http://localhost:3000/d-solo/GQ47zhIZk/chri-dashboard?orgId=1&amp;refresh=1m&amp;theme=dark&amp;from=now-24h&amp;to=now&amp;panelId=2> </iframe>"

```

---

<div class="post-metadata">

**Author:** ![bakman2](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bakman2/32/6207_2.png) [@bakman2](https://discourse.nodered.org/u/bakman2)\
**Post date:** [18 October 2019 14:48 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/20 "2019-10-18T14:48:07Z")

</div>

Caused by security.  
[Read more](https://stackoverflow.com/questions/33111835/how-to-set-up-grafana-so-that-no-password-is-necessary-to-view-dashboards) how to disable it.

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [18 October 2019 14:56 UTC](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667/21 "2019-10-18T14:56:29Z")

</div>

Don't you need `src="http://...."` in the template?

[Next page](https://discourse.nodered.org/t/best-way-to-show-grafana-in-dashboard/15667.md?page=2)
