opCharts HTML widgets is a way to define templates which opCharts can render and present to the user.
Create an opCharts component to tell the dashboard it can render this new file. For this, create a new json file in /usr/local/omk/lib/json/opCharts/components.d/: Example: acme_component.json
{ "name": "What the component is called in the dashboards dropdown list", "ep_template_file": "The loccation of the template file", "options": { "titleText": "the component display name" }, "type": "ep_template" } |
Create <omk_dir>/lib/json/opCharts/components.d/acme_component.json
{ "name": "Acme Component", "ep_template_file": "public/acme_list", "options": { "titleText": "My Title" }, "type": "ep_template" } |
Restart omkd daemon:
sudo service omkd restart |
In this example we will create a Dashboard with a Wikipedia Search.
<div class="row"> <div class="container-fluid"> <div class="navbar-header"> <iframe id="wikipediaIframeExample" title="Wikipedia iframe Example" width="900" height="600" src="https://www.wikipedia.org/"> </iframe> </div> </div> </div> |
Create <omk_dir>/lib/json/opCharts/components.d/wikipedia_component.json
{ "name": "Wikipedia Component", "ep_template_file": "public/wikipedia", "options": { "titleText": "Wikipedia search Embebed" }, "type": "ep_template" } |
Restart omkd daemon:
sudo service omkd restart |
It is not possible to embedded some webpages in an iFrame due to the CSP. The Content Security Policy is a http header from the original server that prevents to load a webpage from an external domain - Or even the same.
It is possible to identify this heady visiting the external webpage and looking for the existence of this header:
Trying to embed this webpage as an iframe, the result will be something like the following: