This will require Builder privileges for setup and implementation.
In many instances having the weather on your dashboards a great way to keep your staff engaged in the dashboards. We can use Dark Sky's Forcast.io to create a simple iFrame to get a simple weather panel. For more on Dark Sky's Forcast.io: Forcast.io, Dark Sky
What You Will Need:
Basic Weather Widgets
Create a new dashboard and click on the Panel icon . Select the IFRAME Panel from the options. Fill in the following information to populate your chart.
URL: //forecast.io/embed/#lat=42.6064&lon=-83.1498&name=Troy, Michigan
To customize your location you will need to update the latitude (lat), longitude (lon), and name. You can use a site like Latitude and Longitude Finder to find your latitude (lat) and longitude (lon). For the name follow the same format. City, State.
- lat=42.6064 & lon=-83.149
- Name ( City, State)
In iFrame Panel
- Uncheck: Allow Form Submission
- Allow Scripts: Say Checked
- Check: Allow SAME-ORIGIN
You can visit: Meteoblue Weather Close to You
- In the Location Search field at the top enter your city
- Customize your widget
- Then select just the URL in the code at the bottom and copy and paste this into your IFRAME Panel
WillyWeather is another site where you can create your own customized weather widget.
Animated Weather Map
If you would like to make your HTML5 Dashboard(s) more engaging an animated weather map is one way you can do this. We can use Windy to create a custom map and it will build the iFrame code for you to insert into your Dashboards.
Please Note: You will also need to be a Builder, Data Admin, or Admin to set this up.
What You Will Need:
- iDashboards http://<server:port>idashboards/
- To begin go to https://www.windy.com/
- In the Search Location field enter your city
- At this point to you can zoom in or out to your desired elevation
- Next use the controls on the upper right to select what type of map and weather conditions you'd like to display
- Once you've customized your map to your liking, click the hamburger button in the upper left corner and select Embed Widget on page
- A pop out window will open and you'll notice your iFrame code in the pink panel at the bottom
- In the Dashboard Designer Select an empty frame
- Click the Panel button
- Select IFRAME panel
- Next copy and paste your HTML code from windy.com to a text editor. You want to copy the URL between the parentheses out of the code and paste it into the URL field in your panel.
- Allow Form Submission
- Allow Scripts
- Click OK and you will now see your Weather Map panel in your dashboard!
If you would like to add a weather widget panel to your dashboard you can do so by going to Booked.net They have a number of styles to choose from and you can customize the color and size for most of them.
- Start by navigating to the upper right corner and select chose your location to set your location
- Next select the style of widget you like and click the customize button if you'd like to make some changes
- Then click the Get HTML Code button
- In your dashboard, select your panel and click this button and select HTML Panel.
- Click the Edit button and copy and paste the HTML code from your widget into this window
- Click OK.
- Save your dashboard and now you have a weather widget in your Dashboard!
For More Information:
- Dashboard & Chart Design Articles
- Reports: Embedded Viewer Mode (iFrames)
- iDashboards Builder Manual 8 Designing Charts
- iDashboards Builder Manual 6.17.4 IFRAME Panel
- Inserting a Website into your Dashboards (iFrame Panel)
If the above is unable to resolve the issue, then please contact truOI Support for further assistance.