Welcome to the Cumulus Support forum.

Latest Cumulus MX release 3.6.10 (build 3086) - 24 June 2020 (please see important announcement regarding releases since 3.5.0)
Legacy Cumulus 1 release v1.9.4 (build 1099) - 28 November 2014 (a patch is available for 1.9.4 build 1099 that extends the date range of the NOAA report and Snow Index drop-down menus to 2030)

See the Wiki to download the software or click on the Downloads link in the Forum Banner.

Colour settings, defaults and user modifications

Discussion of the Cumulusutils tool and website generator.

Moderator: HansR

User avatar
HansR
Posts: 1084
Joined: Sat 20 Oct 2012 6:53 am
Weather Station: Davis Vantage Pro 2+
Operating System: Raspbian GNU/Linux 10 (Buster)
Location: Wagenborgen (NL)
Contact:

Re: Colour settings, defaults and user modifications

Post by HansR »

Anybody looking for some nice colour combinations?
Look at this twitter account.
https://meteo-wagenborgen.nl / Cumulus 3.6.8 (build: 3084)
Davis Vantage Pro 2+ / Raspberry Pi 3 Model B Plus Rev 1.3
Raspbian Linux 10 (buster) / 4.19.118-v7+ armv7l
Mono JIT compiler version 6.8.0.123 (tarball Tue May 12 15:31:43 UTC 2020)

User avatar
HansR
Posts: 1084
Joined: Sat 20 Oct 2012 6:53 am
Weather Station: Davis Vantage Pro 2+
Operating System: Raspbian GNU/Linux 10 (Buster)
Location: Wagenborgen (NL)
Contact:

Re: Colour settings, defaults and user modifications

Post by HansR »

Below are the two relevant sections of cumulusutils.ini of Beamaris Weather Tasmania. A dark theme.
As you will see on his site (soon: currently down because of sensor trouble) there is also a complete revision of the graphs to avoid the large light area in this dark theme.
I will study that to see if I can make that configurable as well. No guarantees that will be configurable from within CumulusUtils but I'll look at it.
In the mean time, you will find below his configuration for what is currently in the cumulusutils.ini file which already has major dark impact.

The Graph section:

Code: Select all

[Graphs]
GraphColors=['darkcyan', 'crimson', 'cyan', 'blue', 'green', 'yellow', 'red', 'blueviolet', 'chartreuse', 'coral', 'cornflowerblue', 'darkblue', 'darkgreen']
WindRose=true
WindRoseNrOfWindforceClasses=10
WindRoseMaxWindSpeed=40
WindRoseColors=['#00008d', '#0000f4', '#0058f6', '#00bfff', '#22ffdb', '#87ff77', '#effd12', '#feac00', '#ff4800', '#e20001', '#7a0300']
WindRoseInversed=false
And the relevant entries in the Website Section:

Code: Select all

[Website]
ColorMenuBackground=Lightgrey
ColorMenuText=Black
ColorToggler=Black
ColorDropdownMenuBackground=Lightgrey
ColorDropdownMenuText=Black
ColorDropdownMenuHoverBackground=Silver
ColorDropdownMenuHoverText=Black
ColorTitleBar=#1f1f1f
ColorTitleText=#a8a8a8
ColorTitleBackGroundImage=
ColorDashboardCellTitleBarBackground=#2e2e2f
ColorDashboardCellTitleBarText=#a8a8a8
ColorDashboardCellText=#a8a8a8
ColorDashboardCellBackground=#1f1f1f
ColorReportviewText=#a8a8a8
ColorReportviewBackground=#2e2e2f
ColorFooterLink=#E87510
ColorFooterLinkHover=OrangeRed
ColorFooterBackground=lightgrey
ColorFooterText=Black
ColorBodyBackground=#2e2e2f
ColorDashboardUpIndicator=Chartreuse
ColorDashboardDownIndicator=Red
SteelseriesDirAvgPointertype=TYPE8
SteelseriesDirAvgPointerColour=BLUE
SteelseriesRainUseSectionColours=false
SteelseriesRainUseGradientColours=true
SteelseriesLedVisible=false
SteelseriesFramedesign=TILTED_BLACK
SteelseriesBackgroundColor=DARK_GRAY
SteelseriesPointerColour=RED
SteelseriesPointerType=TYPE8
SteelseriesLcdColour=BLUE
SteelseriesForegroundType=TYPE1
SteelseriesKnobType=STANDARD_KNOB
SteelseriesKnobStyle=SILVER
You do not have the required permissions to view the files attached to this post.
https://meteo-wagenborgen.nl / Cumulus 3.6.8 (build: 3084)
Davis Vantage Pro 2+ / Raspberry Pi 3 Model B Plus Rev 1.3
Raspbian Linux 10 (buster) / 4.19.118-v7+ armv7l
Mono JIT compiler version 6.8.0.123 (tarball Tue May 12 15:31:43 UTC 2020)

User avatar
HansR
Posts: 1084
Joined: Sat 20 Oct 2012 6:53 am
Weather Station: Davis Vantage Pro 2+
Operating System: Raspbian GNU/Linux 10 (Buster)
Location: Wagenborgen (NL)
Contact:

Re: Colour settings, defaults and user modifications

Post by HansR »

OK, I had the outstanding action to study Beaumaris Highcharts implementation for his Dark Theme and see if it is doable to implement such thing in CumulusUtils. And with implementing I mean generate a theme based on parameters in the inifile.

I did spend the day on this - not all of it, we had our first summers day with 26.7 deg, tomorrow towards the 29 degrees.

My conclusion is: yes I could but I won't. The complexity easily gets pretty high when you start implementing colour nuances on the different objects in a graph. And of course you want your degrees of freedom. Does this mean it is impossible for the average user to modify the graph colouring? No absolutely not.

Below I will describe in a nutshell what you should do if you would like to choose colours, where the light graphs area would require a more dimmed tone.

It is all about themes for Highcharts and Higcharts has a nice explanation on its site on how to deal with style and design. So with some practice and experimenting you can easily make large changes and make your first Coloured Theme. From there you can work it out and make it more complex, with more subtle nuance, as you go.

How do you handle that within CumulusUtils because everything is generated? Right?

Yes and no. There is one file in the lib directory which you can safely replace by your own version: HighchartsDefaults.js Don't touch the others, those are libraries and generated files :!: This is actually a Highcharts theme file and it is the same as the grid.js theme file which comes with the distribution of CumulusMX. One of those files: dark-unica.js is the basis of Tony's Dark Theme. There are also other themes in that distribution which you can start studying/modifying. Start by changing the background and increment complexity as you go.

Then when you think you are done, there are the following methods to activate your HighchartsDefaults.js:
  1. Replace the HighchartsDefaults.js directly in the lib directory of your the website after running CumulusUtils;
  2. Replace your HighchartsDefaults.js in the utils directory and run CumulusUtils, the file goes straight to your website;
  3. Remove the distribution version of HighchartsDefaults.js from the utils directory and place your own version on the website. As long as there will be no HighchartsDefaults.js file in the distribution directory, the one on the website will not change.
Starting your website will show your modifications immediately when HighchartsDefaults.js is modified.
Have fun!

NB: Tony's HighchartsDefaults.js is added to the previous message to complete his colouring data.
https://meteo-wagenborgen.nl / Cumulus 3.6.8 (build: 3084)
Davis Vantage Pro 2+ / Raspberry Pi 3 Model B Plus Rev 1.3
Raspbian Linux 10 (buster) / 4.19.118-v7+ armv7l
Mono JIT compiler version 6.8.0.123 (tarball Tue May 12 15:31:43 UTC 2020)

User avatar
HansR
Posts: 1084
Joined: Sat 20 Oct 2012 6:53 am
Weather Station: Davis Vantage Pro 2+
Operating System: Raspbian GNU/Linux 10 (Buster)
Location: Wagenborgen (NL)
Contact:

Re: Colour settings, defaults and user modifications

Post by HansR »

To follow up on the previous message: apparently I missed that the themes are no longer distributed with CumulusMX (I still have them in my installation tree), but you can find them on the Highcharts GitHub repository.
https://meteo-wagenborgen.nl / Cumulus 3.6.8 (build: 3084)
Davis Vantage Pro 2+ / Raspberry Pi 3 Model B Plus Rev 1.3
Raspbian Linux 10 (buster) / 4.19.118-v7+ armv7l
Mono JIT compiler version 6.8.0.123 (tarball Tue May 12 15:31:43 UTC 2020)

Post Reply