search

ryantxu / ajax-panel

Ajax Panel Plugin for Grafana
MIT License
153 stars 154 forks source link

New render option - safe HTML #31

Open Ekimik opened 5 years ago

Ekimik commented 5 years ago

Hi, I have certain specific datasources and I need to load some metrics from these datasources to Grafana. So I created simple app, which creates HTML snippet with desired content, which is then loaded to Grafana by this plugin. I also add inline styles to my template. My app creates HTML snippet similar to

<div style="color: #d8d9da; height: 100%;">
<div style="display: flex; align-items: center; height: 100%;font-size: 2.5rem;color:#299c46">
    <div style="flex-grow: 1; text-align: center;">
        <div style="font-weight: 500; margin: 4px;">0</div>
        <div style="font-weight: 500;"></div>
    </div>
</div>
</div>

But result in Grafana after rendering is 

<div>
<div>
    <div>
        <div>0</div>
        <div></div>
    </div>
</div>
</div>

I believe the reason for this is Angular SCE feature, which is used when rendering content as HTML. It would be nice if inline styles remain in HTML, because snippet mentioned above is useless without colors (green - ok, red - failure).

scotte commented 5 years ago

Any movement on this? I am running into the same issue - I have remote HTML content than I'm trying to put in a grafana dashboard via this plugin, and unfortunately without providing some inline styling it doesn't really work for my purposes. Thanks!