Charts

Under construction

Introduction

One of the most important modules of CumulusUtils is the charting module as it gives insight in in your weather data. A picture says more than a thousand words. The charting is subdivided in four sections: Rain charts, Temperature charts, Solar charts and Wind charts.

And if you run the Website Generator, the Home page shows the charts similar (almost equal) to the charts which default to the CumulusMX Recent Charts page and CumulusMX Historic Charts page. From end of 2020 CumulusUtils begins to deviate in charting approach from CumulusMX with respect to those default charts.

This page describes only the common features and requirements, the graphs themselves are discussed on their own page.

The charts are created using HighCharts using their non-commercial license. If you want to use the charts or the Website Generator of CumulusUtils, please make yourself acquainted with this license.

Operation

This module is included in the website. When needed as a single output the following command is given:

  utils/bin/cumulusutils.exe graphs

The Home page charts of the website will be described there.

Output

The output are the files: graphstemp.txt, graphsrain.txt, graphswind.txt and graphssolar.txt.

These files contain both the menu code in javascript (each file has its own selection menu), the Highcharts code in javascript for the charts and the data.

Inifile parameters

The charting module is second in place of modules with the most parameters (the Website Generator being first) and also require more explanation. Note that the charts on the Home page of the Website have their own explicit colour specifications.

All parameters belong to the section [graphs]:

   [Graphs]

All charts can be individually selected to be present or not. If the value of the following parameters is false the chart and its data will be generated to the output, but the menu choice will not be present so the user can't select.

Rain graphs:

   DailyRain=true
   MonthlyRain=true
   YearRainstats=true
   YearMonthRainstats=true

Temperature charts:

   MonthlyTemp=true
   YearTempstats=true
   YearMonthTempstats=true
   WarmerDays=true
   HeatMap=true

Wind charts:

   WindRose=true
   Windrun=true

Solar charts:

   SolarHours=true
   SolarEnergy=true
   SolarHoursYearMonth=true
   SolarEnergyYearMonth=true

Miscellaneous charts:

   DailyEVT=true
   MonthlyEVT=true
   AverageClash=true

Chart parameters:

   UseHighchartsBoostModule=true | false
   UseNormalTempReference=both | Normal | StationAverage    (default = Normal)
   UseNormalRainReference=both | Normal | StationAverage    (default = Normal)
   MaxNrOfSeriesVisibileInGraph=3                           (default = 2)
   PeriodMovingAverage=365                                  (default = 180)
   WindRoseNrOfWindforceClasses=6                           (default = 6)
   WindRoseMaxWindSpeed=60                                  (default = 60)
   WindRoseInversed=false | true                            (default = false)
   WindrunClassWidth=75                                     (default = 75)
   HeatmapNumberOfYearsPerPage=10                            (default = 10)

Map Colour parameters (see Charts behaviour)

   GraphColors=
   ;GraphColors=['#058DC7', '#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4']
   WindRoseColors=
   ;WindRoseColors=['lightgrey', 'green', 'blue', 'yellow', 'orange', 'red', 'deeppink', 'purple', 'black']

Inner working

Algorithmic

The output files are HTML UTF8 format. All javascript is included in <script> tags so these are not pure javascript libraries. For each output file the javascript menu is written. When finished the Highcharts lib includes are written IF the modules are not meant to be used in the CumulusUtils Website Generator.

When menu and includes are ready all required graphs are generated together with their data. Code generation and data selection is a one pass process.

Defaults, Colours and Language

Defaults

Defaults are taken from the Highcharts theme which is current. See the page for the HighCharts theme.

Colours

NOTE: the colours of the lines in the Website Generator Home page have their own specification, see the Website Generator and Charts Compiler.

A very important thing with the graphs is the Colour selection. For some charts, users can specify colours in multiples ways for other charts no specification is possible. In general for line charts, the user can choose the colour per line, for specific charts like the heatmap no choice is possible. See each chart description for the specification. If any colour specification in reality is not according to this specification, please report as a bug (either in documentation of in software)

Where applicable, use is made of the Highcharts colour specification.

1. A set of default colours can be specified in the parameter section. For the WindRose a specific selection can be specified.
2. When the selection possibility set to empty a fallback is made to the HighCharts theme in use.
3. When no colours are specified in the theme, then the user relies on the implicit Highcharts defaults.

Language

For the Language in the charts the user must make a distinction between the texts CumulusUtils generates for titles, series names and tooltips. Those texts are found in the CUstringsXX.txt file and have to be translated by the user. For Locale specific and ruled translations (like weekdays, months etc...) CumulusUtils generates a file called HighchartsLanguage.js in which names of days, months and abbreviated month names are translated conform the Locale the user specifies. These are set as options to Highcharts and thus will always be in the local language.

This file may also be used for other Locale specific attributes like separators, if so, it will be specified here.