<<< WeeWX Guides
Add Additional Tabs to Season
Background
Always looking to expand and extend the capabilities of WeeWX, I am always curios to know how todays temperatures compare to previous years. The data is availale in the Monthly and Yearly Reports, but to be honest it is quite tedious going through all of those. So I decided to see if I could add that data to a new tab on my home page.
Having successfully added this data to the statistics page I decided to see if I could extend that functionality, this page documents how I got that additional data to display
This solution builds on Extending High Low and so if you havcen't done that yet they you need to at least complete the changes to stats.py that are documented there
Modify index.html.tmpl
The file where that controls the main page of the Seasons display is index.html.tmpl, this is where we are going to add the additional tab for alltime and also modify the data that is shown for the previous week to be the previous seven days.
First search for the section plot_group and make the following changes
pi@raspberrypi:~ $ vi /home/weewx/skins/Seasons/index.html.tmpl
.
.
.
<div id="plot_group">
<div id="plot_title" class="widget_title">History:
<a class="button_selected" id="button_history_day" onclick="choose_history('day')">Day</a>
<a class="button" id="button_history_seven_day" onclick="choose_history('seven_day')">Week</a>
<a class="button" id="button_history_month" onclick="choose_history('month')">Month</a>
<a class="button" id="button_history_year" onclick="choose_history('year')">Year</a>
<a class="button" id="button_history_alltime" onclick="choose_history('alltime')">All Time</a>
</div>
.
.
.
Then modify the plot section name for the last weeks history as shown
Note: the name used here must match exactly the name used above in onclick="choose_history('seven_day')
pi@raspberrypi:~ $ vi /home/weewx/skins/Seasons/index.html.tmpl
.
.
.
<img src="daytempfeel.png" alt="$obs.label.feel" />
</div>
<div id="history_seven_day" class="plot_container" style="display:none">
<img src="weektempdew.png" alt="$obs.label.outTemp" />
.
.
.
Then add a new section to display some graphs for the all time data, I will explain how to create this further down.
pi@raspberrypi:~ $ vi /home/weewx/skins/Seasons/index.html.tmpl
.
.
.
<div id="history_alltime" class="plot_container" style="display:none">
<img src="2yearhilow.png" alt="$obs.label.outTemp" />
<img src="2yearwind.png" alt="$obs.label.windSpeed" />
<img src="2yearrain.png" alt="$obs.label.rain" />
<img src="5yearhilow.png" alt="$obs.label.outTemp" />
<img src="5yearwind.png" alt="$obs.label.windSpeed" />
<img src="5yearrain.png" alt="$obs.label.rain" />
</div>
.
.
.
Modify hilo.inc
You may have noticed that when you change the tabs from Day to Week to Month that the data in the High/Low section also changes along with the graphs that are shown. This is controlled by the hilo.inc file and so we also need to make a few changes in there as shown below
pi@raspberrypi:~ $ vi /home/weewx/skins/Seasons/hilo.inc
#set $archive_data = [('day', $day), ('seven_day', $seven_day), ('month', $month), ('year', $year), ('alltime', $alltime)]
<div id='hilo_widget' class="widget">
<div class="widget_title">
<a href="statistics.html">High/Low</a>
<a class="widget_control"
onclick="toggle_widget('hilo')">♦</a>
</div>
<div class="widget_contents">
<table>
<tbody>
<tr>
<td></td>
<th> <br/>Today</th>
<th class="hilo_seven_day"> <br/>Week</th>
<th class="hilo_month"> <br/>Month</th>
<th class="hilo_year"> <br/>Year</th>
<th class="hilo_alltime"> <br/>All Time</th>
<td></td>
</tr>
<tr>
<td class="label">$obs.label.outTemp</td>
.
.
.
As with the changes we made in Extending High Low, this file first sets up an array, which is the first change we make to include our new seven_day and alltime variables
Then we modify the table headings to include the new and modified data and the rest of the HTML file self generates from the array
Modify skin.conf
So now that we have made all the modifications to display the new data, you may remember that we also modified index.html.tmpl to display some new images. To do that we are going to first have to create them and this is done by editing the skin.conf file in the Seasons subdirectory.
First find the [ImageGenerator] section and then add some sections for the graphs you want to display, I put these at the end of the section but it does not appear to make any difference where you put them but be aware of the inheritance rules that apply or you may get unexpected results.
I also discovered that you may need to adjust the x_interval value to control the granularity of the x axis on the graph. This is an undocumented feature that I discovered when examining utilities.py to understand why the graphs were not being displayed as expected.
pi@raspberrypi:~ $ vi /home/weewx/skins/Seasons/skin.conf
.
.
# The ImageGenerator creates image plots of data.
[ImageGenerator]
.
.
.
[[2year_images]]
x_label_format = %b %Y
x_interval = 7889400 # 3 Months
bottom_label_format = %x %X
time_length = 63115200 # 2 years
aggregate_type = avg
aggregate_interval = 345600 # 4 Days
show_daynight = false
[[[2yearhilow]]]
[[[[low]]]]
data_type = outTemp
aggregate_type = min
label = Min
[[[[hi]]]]
data_type = outTemp
aggregate_type = max
label = Max Temperatures over last 2 Years
[[[2yearwind]]]
[[[[windSpeed]]]]
[[[[windGust]]]]
aggregate_type = max
label = Gust Speed over last 2 Years
[[[2yearrain]]]
yscale = None, None, 0.02
plot_type = bar
label = Rain (fortnightly total) over last 2 Years
[[[[rain]]]]
aggregate_type = sum
aggregate_interval = 604800 # two Weeks
[[5year_images]]
x_label_format = %b %Y
x_interval = 15778800 # 6 Months
bottom_label_format = %x %X
time_length = 157788000 # 5 years
aggregate_type = avg
aggregate_interval = 1209600 # 14 Days
show_daynight = false
[[[5yearhilow]]]
[[[[low]]]]
data_type = outTemp
aggregate_type = min
label = Min
[[[[hi]]]]
data_type = outTemp
aggregate_type = max
label = Max Temperatures over last 5 Years
[[[5yearwind]]]
[[[[windSpeed]]]]
[[[[windGust]]]]
aggregate_type = max
label = Gust Speed over last 5 Years
[[[5yearrain]]]
yscale = None, None, 0.02
plot_type = bar
label = Rain (monthly total) over last 5 Years
[[[[rain]]]]
aggregate_type = sum
aggregate_interval = 2629800 # the length of a nominal month
.
.
.
Modify utilities.py
As I just mentioned I ended up modifying utilities.py to resolve some undesirable display chracteristics. The first change detailed is a bug in the code and will be fixed in future releases, but the second change is one I made to improve the look and feel of the graphs, I have entered this as a change request which may or may not be adopted
Below are the changes I made to format my graphs as desired
pi@raspberrypi:~ $ vi /home/weewx/bin/weeplot/utilities.py
.
.
.
elif 27 * 3600 < tdelta <= 31 * 24 * 3600 :
# The time scale is between a day and a month. A time increment of one day is appropriate
start_dt = tmin_dt.replace(hour=0, minute=0, second=0, microsecond=0)
stop_dt = tmax_dt.replace(hour=0, minute=0, second=0, microsecond=0)
tmax_tt = tmax_dt.timetuple()
if tmax_tt[3]!=0 or tmax_tt[4]!=0 :
stop_dt += datetime.timedelta(days=1)
interval = 24 * 3600
elif tdelta <= 2 * 365.25 * 24 * 3600 :
# The time scale is between a month and 2 years. A time increment of a month is appropriate
start_dt = tmin_dt.replace(day=1, hour=0, minute=0, second=0, microsecond=0)
(year , mon, day) = tmax_dt.timetuple()[0:3]
if day != 1 :
mon += 1
if mon==13 :
mon = 1
year += 1
stop_dt = datetime.datetime(year, mon, 1)
# Average month length:
interval = 365.25/12 * 24 * 3600
else :
# The time scale is between a month and 2 years. A time increment of a year is appropriate
start_dt = tmin_dt.replace(day=1, hour=0, minute=0, second=0, microsecond=0)
(year , mon, day) = tmax_dt.timetuple()[0:3]
if day != 1 or mon !=1 :
day = 1
mon = 1
year += 1
stop_dt = datetime.datetime(year, mon, 1)
# Average year length
interval = 365.25/4 * 24 * 3600
# Convert to epoch time stamps
start_ts = int(time.mktime(start_dt.timetuple()))
stop_ts = int(time.mktime(stop_dt.timetuple()))
.
.
.
In the first change I added an equals sign to the equation, this is the bug that is being fixed
In the second change I reduced the granularity to quarterly as I think it makes the graphs look better