Unlock Weather Insights: How You Can Use Power BI with OpenWeatherMap — Part 18

Published in

Microsoft Power BI

8 min readMay 19, 2024

Sample image from the weather dashboard we will create. Background image in dashboard Photo by Tim Foster on Unsplash

Earlier, in part 17 of this series, we added the humidity information to the dashboard. In this part of the series, we will add the sunrise and sunset times to the dashboard. The steps below will take you through the process. Again, you can download the icons used in this dashboard from here: Weather Dashboards Icons. Or you could use icons from uxwing which is a collection of free icons you can download for commercial projects without attribution.

Adding Sunrise Information to the Dashboard

Click Insert in the toolbar at the top of the Power BI Desktop window to open the inset menu.
Clicking on the down arrow underneath the Button icon to show the buttons that we can add to the report.
We will add a blank button. Click on blank from the list of buttons.

Next, we will format and position the button.

Click the format button, at the far right-hand side of the Power BI Desktop window.
Expand the size and style option on the visual tab in the format pane.
We will now set the width and position of the rectangle.
Change the height in the Size and position options from a value of 40 to 50.
Change the width in the Size and position options from the current value of 100 to 50 by clicking in the width box and entering the new value.
Change the horizontal position in the Size and position options from the current value of 0 to 50 by clicking in the horizontal box and entering the new value.
Now change the vertical position in the Size and position options from the current value of 0 to 560 by clicking in the vertical box and entering the new value.

Now we will add the sunrise icon to the button.

Adding Sunrise Icon

The sunrise and sunset icons I wished to use were similar and potentially confusing. So I changed the sunrise icon to show a sun between two trees shining on a ploughed field.

Expand the button style options option on the visual tab in the format pane.
Make sure that the state says Default. If it is showing anything else, click on the down arrow next to the status box to show the options and select Default from the list.
Turn off the icon by clicking on the icon toggle button.
Expand the fill option on the visual tab in the button style options.
Click the box located just below the Color option it will currently say browse. The windows file explorer will open.
Use the file explorer to navigate to where you saved the wind icon and select the wind icon file. If you used the icon from my collection of icons ,it will be called “nature-landscape-icon.svg”
Click open to load the icon into the button.
Change the transparency from 50% to 0% by either typing in the transparency box or dragging the slider.
We will need to change the colour from the default white to the background colour.
Expand the Color option.
Click the down arrow to expand the colours to use. We will use an orange colour for this rule. You can select the orange colour by clicking on it or you can click on “more colors…” to open a window with hex codes and red, green and blue values. As shown here.

Press the backspace button on your keyboard to clear the current hex value.
Enter the following in the hex text box. #F8F8F8. This will set the background to a light grey background. This background will soften the effect of the background image that we will add later, so we can see the information clearly.
Finally, if the Border option is showing On, turn off the border by clicking on the Border toggle button.

To add the sunrise time the card, we will use a text box and using the value option in the text box to add the value from the current weather table. As I have previously written, I prefer this method over using a text box and cards because it keeps the text and values aligned.

Adding Sunrise Time

From the Home menu or Insert menu, click on the text box icon. From the Home menu or Insert menu, click on the text box icon. This will add the text box to the report canvas.
Click on the Value Icon to open the Dynamic value options window.

In box showing “Ask a question about your data” enter current weather sunrise. This will tell Power BI to use the sunrise value from the current_weather table, which is suitably formatting. As you are typing, you will see “current weather sunrise” appear on the list of columns and measures that appear. Click on current weather sunrise on that list and Power BI will add it for you.
Once you have entered current weather sunrise, then Power BI will underline it with a blue line to show that Power BI has recognised the measure name. If it is showing red, then Power BI does not recognise the measure and you will need to clean out what you entered and type in the name again. When Power BI recognizes it, the results area will display the current sunrise time.
We should name this value as we might need to update it at a later date and this will help us find it. To do this, select the text in the value box and type sunrise.
Click Save
To make the sunrise value look nicer, we need to format the value. To do this, click on the comma symbol in the formatting options below the result area.
Now we need to format this dynamic value, select the text showing the current temperature. The easiest way is to hold down the shift key and press the left cursor button.
Change the font to DIN and set the font size to 14.
Click on the Bold icon to make the value bold so it pops out a bit more.
The completed text box formatting window should look like this.

Completed Power BI Text Box Formatting Window

We now need to size and position this text box.

Click the format button, at the far right-hand side of the Power BI Desktop window.
Expand the size and style option on the visual tab in the format pane.
We will now set the height, width, and position of the rectangle.
Change the height in the Size and position options from the current value of 300 to 37 by clicking in the height box and entering the new value.
Change the width from the current value of 300 to 120.
Change the horizontal position in the Size and position options from the current value of 100 to 110 by clicking in the horizontal box and entering the new value.
Now change the vertical position in the Size and position options from the current value of 100 to 570 by clicking in the vertical box and entering the new value.
If the background toggle button shows on. Turn off the background for the text box by clicking on the background toggle button.

Now we will set the font colour for this text box to a dark blue to soften the look of the text.

Click in the text box and press CTRL-A.
Expand the font color menu.
Select More colors…
Enter #072C4F into the Hex box.

Now our dashboard has the sunrise information added. Next, we will add the sunset information. The steps to add the sunset information are very similar to the sunrise. To add the sunset information, follow the steps for adding sunrise information to the dashboard. The following list shows the changes to be made to the adding sunrise information to add the sunset information successfully.

Adding Sunset Icon

Follow the steps for adding the sunrise icon, but change the following items in the steps.

Change the icon used for the button from “nature-landscape-icon.svg” to “sunrise_icon.svg” I used the sunrise icon as it reminded me more of a sunset than a sunrise.
Change the horizontal position in the Size and position options from the current value of 0 to 230 by clicking in the horizontal box and entering the new value.

Adding Sunset Time

Add the text box following the steps for adding the sunrise time and then follow the steps below to change to showing the sunset time.

In box showing “Ask a question about your data” enter current weather sunset. This will tell Power BI to use the sunset value from the current_weather table, which is suitably formatting. As you are typing, you will see “current weather sunset” appear on the list of columns and measures that appear. Click on current weather sunset in that list and Power BI will add it for you.
We should name this value as we might need to update it at a later date and this will help us find it. To do this, select the text in the value box and type sunset.
Change the height in the Size and position options from the current value of 300 to 37 by clicking in the height box and entering the new value.
Change the width from the current value of 300 to 120.
Change the horizontal position in the Size and position options from the current value of 100 to 285 by clicking in the horizontal box and entering the new value.
Now change the vertical position in the Size and position options from the current value of 100 to 570 by clicking in the vertical box and entering the new value.
Now we will set the font colour for this text box to a dark blue to soften the look of the text.
Click in the text box and press CTRL-A.
Expand the font color menu.
Select More colors…
Enter #072C4F into the Hex box.

Reach out to me if you need help with following the changes to the steps for adding sunset information. Air quality is the last piece of item to be added to the dashboard. We add that in the next part of this series.

Don’t forget to subscribe to
👉 Power BI Publication
👉 Power BI Newsletter
and join our Power BI community
👉 Power BI Masterclass