# Grafana IFrames are flickering when embeded in angular application

**URL:** <https://community.grafana.com/t/grafana-iframes-are-flickering-when-embeded-in-angular-application/18255>\
**Category:** Grafana Plugin Development\
**Created:** [June 12, 2019, 1:43pm UTC](https://community.grafana.com/t/grafana-iframes-are-flickering-when-embeded-in-angular-application/18255 "2019-06-12T13:43:53Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![vbwatve](https://avatars.discourse-cdn.com/v4/letter/v/bbce88/32.png) [@vbwatve](https://community.grafana.com/u/vbwatve)\
**Post date:** [June 12, 2019, 1:43pm UTC](https://community.grafana.com/t/grafana-iframes-are-flickering-when-embeded-in-angular-application/18255/1 "2019-06-12T13:43:53Z")

</div>

I embeded grafana graph’s IFrame in angular application, however I set autoRefresh of 10 sec.  
It actually started flickering all the IFrames. I don’t think its because of auto refresh applied.

have any one faced same issue?

---

<div class="post-metadata">

**Author:** ![amotl](https://sea2.discourse-cdn.com/grafana/user_avatar/community.grafana.com/amotl/32/5891_2.png) [@amotl](https://community.grafana.com/u/amotl)\
**Post date:** [June 23, 2019, 8:52pm UTC](https://community.grafana.com/t/grafana-iframes-are-flickering-when-embeded-in-angular-application/18255/2 "2019-06-23T20:52:38Z")

</div>

Dear @vbwatve,

we believe we are observing the same thing. To verify that, we humbly ask you to visit the links as outlined in [1] in order to make sure we are talking about the same observation. We are talking about the panels embedded into these pages and what they do to their respective viewports after initial load.

- [Versuchsaufbau “Autonome Zelle”: Solar-Feinstaub-Wetter-Vergleichsding](https://community.hiveeyes.org/t/versuchsaufbau-autonome-zelle-solar-feinstaub-wetter-vergleichsding/1373/10)
- [Hiveeyes One — Hiveeyes system documentation 0.9.0 documentation](https://hiveeyes.org/docs/system/vendor/hiveeyes-one/)
- [Hiveeyes — Kotori 0.22.7 documentation](https://getkotori.org/docs/applications/hiveeyes.html#run-kotori)

Thanks in advance and with kind regards,  
Andreas.

[1] [https://community.hiveeyes.org/t/grafana-embeds-springen-und-storen/2168](https://community.hiveeyes.org/t/grafana-embeds-springen-und-storen/2168)

---

<div class="post-metadata">

**Author:** ![vbwatve](https://avatars.discourse-cdn.com/v4/letter/v/bbce88/32.png) [@vbwatve](https://community.grafana.com/u/vbwatve)\
**Post date:** [June 27, 2019, 6:39am UTC](https://community.grafana.com/t/grafana-iframes-are-flickering-when-embeded-in-angular-application/18255/3 "2019-06-27T06:39:22Z")

</div>

Yes @amotl, The same problem i am observing on Mac. for ubuntu, it’s working fine on all the browsers.  
I done the same, embeded panels in angular.

---

<div class="post-metadata">

**Author:** ![amotl](https://sea2.discourse-cdn.com/grafana/user_avatar/community.grafana.com/amotl/32/5891_2.png) [@amotl](https://community.grafana.com/u/amotl)\
**Post date:** [June 27, 2019, 6:23pm UTC](https://community.grafana.com/t/grafana-iframes-are-flickering-when-embeded-in-angular-application/18255/4 "2019-06-27T18:23:35Z")

</div>

Thanks, @vbwatve. So, let’s recap and clarify – obviously as guesstimates because the problem seems so strange we should not draw any preliminary conclusions yet.

- This happens on macOS, it does not happen on Linux.
- It happens when embedding Grafana panels (`dashboard-solo`) into plain HTML pages and Angular applications.

So glad to finally have found someone to investigate this further. Thanks!

---

<div class="post-metadata">

**Author:** ![amotl](https://sea2.discourse-cdn.com/grafana/user_avatar/community.grafana.com/amotl/32/5891_2.png) [@amotl](https://community.grafana.com/u/amotl)\
**Post date:** [July 3, 2019, 9:33pm UTC](https://community.grafana.com/t/grafana-iframes-are-flickering-when-embeded-in-angular-application/18255/5 "2019-07-03T21:33:53Z")

</div>

> [@amotl](#):
>
> So glad to finally have found someone to investigate this further. Thanks!

I just have been able to observe that behavior also with Chrome on Android/LineageOS.

---

<div class="post-metadata">

**Author:** ![amotl](https://sea2.discourse-cdn.com/grafana/user_avatar/community.grafana.com/amotl/32/5891_2.png) [@amotl](https://community.grafana.com/u/amotl)\
**Post date:** [July 3, 2019, 9:51pm UTC](https://community.grafana.com/t/grafana-iframes-are-flickering-when-embeded-in-angular-application/18255/6 "2019-07-03T21:51:21Z")

</div>

> [@amotl](#):
>
> [Hiveeyes - Kotori DAQ](https://getkotori.org/docs/applications/hiveeyes.html#run-kotori)

I believe this might be the best example to get a bit into the details. This HTML page

- is a plain static HTML page generated by [Sphinx](https://www.sphinx-doc.org/).
- contains three Grafana Dashboards in `d-solo` Panel mode embedded as iframes.

I just verified that **none of the dashboards these embedded panels are coming from employs any refresh interval** which I assumed **could** have triggered any focus action which might magically escape the iframe container – how ever this actually might happen at all!? For completeness, I’ve attached direct links to all of the panels embedded on this page below.

While I am unsure whether [Layout changes when embedding dashboard](https://community.grafana.com/t/layout-changes-when-embedding-dashboard/15801) might be related to this issue, I am humbly asking @prokopd if you could afford throwing some thoughts at this issue we are seeing here.

Thanks already and with kind regards,  
Andreas.

* * *

- [Imkerliche Daten / Berlin Wedding 1 [official], Loadcell, Spring 2016.](https://swarm.hiveeyes.org/grafana/d-solo/000000143/berlin-wedding-1-official?panelId=5&from=20160418T200000&to=20160518T160000&orgId=2)
- [Imkerliche Daten / Berlin Wedding 1 [official]. Loadcell. May 2, 2016. Weight gain.](https://swarm.hiveeyes.org/grafana/d-solo/000000143/berlin-wedding-1-official?panelId=5&from=20160430T130000&to=20160503T040000&orgId=2)
- [Imkerliche Daten / Berlin Wedding 1 [official]. Loadcell. Schwarmalarm May 2016.](https://swarm.hiveeyes.org/grafana/d-solo/000000143/berlin-wedding-1-official?panelId=5&from=20160519T040000&to=20160519T170000&orgId=2)
