Page 1 of 1

Help with Dashboard & Highcharts customisations

Posted: Mon 15 Apr 2024 11:44 am
by pacificblue03
Hello,

I have been recently editing my dashboard as per:
https://drive.google.com/file/d/104TqRW ... drive_link

Beneath the Temperature reading, how can i replace the minimum temperature with the minimum reading since midnight? as id like to know what the overnight minimum was not the one right at 9am. I tried to use the webtag for Min since midnight & it did not work. It just showed a -- where that value would be.

Also, for the highcarts charts, how do you change the background colour? i tried to edit the DIV background but that doesnt work. I went through Charts.js & there was no success. I would like to make it darker to match my "dark mode" theme.
https://drive.google.com/file/d/1MYctwR ... drive_link

Thank you for your assistance :)
Antonio.

Re: Help with Dashboard & Highcharts customisations

Posted: Mon 15 Apr 2024 12:42 pm
by freddie
For the minimum temperature, you could set up MX so that it finishes its recording day (rollover time) at midnight. This is the default for a MX installation. To change from a 9am rollover you have to select the "midnight" option in Settings -> Station Settings -> Log Rollover.

Re: Help with Dashboard & Highcharts customisations

Posted: Tue 16 Apr 2024 6:19 am
by pacificblue03
Hi Freddie,

I am not looking to roll-over at midnight as the meteorological day is 9am to 9am, but even the weather sites show the "overnight minimum" this is what I am trying to achieve, I tried the span for the appropriate Web Webtag but it does not work.

Re: Help with Dashboard & Highcharts customisations

Posted: Tue 16 Apr 2024 7:07 am
by freddie
Hi Antonio,

Okay, I understand what you're trying to achieve.

The reason your spam doesn't work is because the tempMidnightTL webtag isn't included in the standard data transfer files, such as websitedata.json. To add it you would need to edit the template file websitedataT.json. This template can be found in the "web" directory of your CumulusMX installation.

Re: Help with Dashboard & Highcharts customisations

Posted: Tue 16 Apr 2024 8:00 am
by pacificblue03
Hi Freddie,

Unfortunately the web folder is external to the interface that is local "dashboard" so i guess it cannot be done, unless there is a local file which defines the tags. Thank you anyway for the help :)

Re: Help with Dashboard & Highcharts customisations

Posted: Tue 16 Apr 2024 8:24 am
by freddie
Oh crikey, sorry I thought you were talking about your website. That webtag will be available to the interface, as the interface uses the CMX API to get its webtag values. You can see it for yourself if you try:

Code: Select all

http://<cmx-ip-address>:8998/api/tags/process.json?tempMidnightTL
So there must be an additional bit of configuration somewhere that will cause that span to become populated with data. You could have a dig around in the javascript code, or maybe look at the CMX source on GitHub. Sorry I can't help any further but I have never tinkered with the interface before.

Re: Help with Dashboard & Highcharts customisations

Posted: Tue 16 Apr 2024 9:33 am
by pacificblue03
Yep that did it! i can see "13.1" as the min, compared to 19.0 at 9am...

Hopefully i can find the way to add it! ive actually done a lot to the dashboard, you can see in my original post (if the link works) or i can re link it.

Re: Help with Dashboard & Highcharts customisations

Posted: Tue 16 Apr 2024 10:08 am
by pacificblue03
Just thought i would mention,


Ive edited the file dashboard,js
i have added line:
tempMidnightTL: inp.tempMidnightTL.toString(),
But the dashboard still displays --.-

So what am i doing wrong?

Re: Help with Dashboard & Highcharts customisations

Posted: Fri 03 May 2024 1:53 am
by pacificblue03
Well few weeks later and no matter what you do in whichever JS file TempMindnightTL tag does nothing but display --.-- so i guess its impossible. The lack of responses here says so as well. Ill just have to deal with my minimum being 9am after 9am ..

Re: Help with Dashboard & Highcharts customisations

Posted: Fri 03 May 2024 7:56 am
by mcrossley
The dashboard gets all the weather data from a web socket feed, the data in that feed is fixed by MX so you cannot add more items to it.

To add additional data to the dashboard, you will have to add your own JavaScript call to the MX API (as above), extract the data from the response, and then write that data into the span you define in the HTML. Set that code to repeat say once a minute.

Regarding the HighCharts background in the original post, the HighCharts configuration is defined in JSON in the script file, you will need to amend that JSON to customise the graph - see the HighCharts documentation: https://api.highcharts.com/highcharts/

Re: Help with Dashboard & Highcharts customisations

Posted: Fri 03 May 2024 11:28 am
by pacificblue03
Managed to get the charts working well, nice darker background now. As for the Temp midnight low ive given up on that as nothing has worked so far so ill just live without it on the dashboard page.

Re: Help with Dashboard & Highcharts customisations

Posted: Fri 03 May 2024 11:43 am
by water01
Puzzled as to why you are not using the Alternate Interface available here https://www.cumuluswiki.org/a/The_Alter ... 8ai.cmx%29

Lots of Options on AI available including colours and maintained by Neil.

Re: Help with Dashboard & Highcharts customisations

Posted: Sat 04 May 2024 4:01 am
by pacificblue03
I did try it before I tinkered with the standard interface. It runs in the AI2 folder.

I just simply do not like it (the dashboard), no offence to the author I'm sure they are working hard on it. But what I have modified mine to is exactly how I like it & it's a fluid website so it will fit to any screen its used from. It's been running my Pro2 Data very well.

Side note, even the AI2 does not allow you to view minimum since midnight so the same problem regardless.

This is a screenshot of my custom interface, though I'm not sure if link will work.
https://drive.google.com/file/d/1_vPalP ... sp=sharing

Re: Help with Dashboard & Highcharts customisations

Posted: Wed 08 May 2024 12:49 pm
by pacificblue03
mcrossley wrote: Fri 03 May 2024 7:56 am The dashboard gets all the weather data from a web socket feed, the data in that feed is fixed by MX so you cannot add more items to it.

To add additional data to the dashboard, you will have to add your own JavaScript call to the MX API (as above), extract the data from the response, and then write that data into the span you define in the HTML. Set that code to repeat say once a minute.

Regarding the HighCharts background in the original post, the HighCharts configuration is defined in JSON in the script file, you will need to amend that JSON to customise the graph - see the HighCharts documentation: https://api.highcharts.com/highcharts/
Hello,
By any chance, could you lead me to the right direction of which js file ill need to make this but also what the code might look like? i know only Very basic javascript, editing the charts took me a while but i did get there. All i would like is to be able to display the min since midnight but everything i try either breaks my guages for some reason or displays --.-- or both.

for example in the dashboard.js under

// Convert from MX format to realtimeGauges.txt format
function convertJson(inp) {
return {
i have added
tempMidnightTL: inp.LowMidnight.toString(),

What am i missing :)

Re: Help with Dashboard & Highcharts customisations

Posted: Sun 19 Jan 2025 2:00 am
by pacificblue03
Hello,

It's been a while since i have played with my interface, mainly the dashboard page.
I still have not been able to figure out, below temperature, how to make the "low" figure the one that today/yesterday low pulls.

In Australia our data is from 9am to 9am, i wish to replicate this on this page if possible.

Thanks.