Welcome to the Cumulus Support forum.

Latest Cumulus MX V3 release 3.28.6 (build 3283) - 21 March 2024

Cumulus MX V4 beta test release 4.0.0 (build 4017) - 17 March 2024

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 drop-down menus to 2030)

Download the Software (Cumulus MX / Cumulus 1 and other related items) from the Wiki

Show All High Charts Instead Of A Selection

Other discussion about creating web sites for Cumulus that doesn't have a specific subforum

Moderator: daj

Grimers
Posts: 240
Joined: Tue 24 Nov 2015 9:07 am
Weather Station: Davis Vantage Pro2
Operating System: Windows 11 64-bit
Location: Newton Poppleford, Devon, UK
Contact:

Show All High Charts Instead Of A Selection

Post by Grimers »

Hi there,

Is it possible to show all high charts on the graphs page one by one instead of having a selection at the top? I tried inserting this code:

Code: Select all

<div id="chartcontainer"></div>
multiple times into the trends page but the other instances just appeared as blank.

I am trying to replicate the old Cumulus graphs which were images but that was a lot easier to do as I only had to insert the images in one by one, this seems more complex.

Thanks,

William
jlmr731
Posts: 225
Joined: Sat 27 Aug 2016 12:11 am
Weather Station: Davis vantage pro 2
Operating System: Debian
Location: Wickliffe, Ohio
Contact:

Re: Show All High Charts Instead Of A Selection

Post by jlmr731 »

i believe you will have to replicate that part of the code for each chart
Grimers
Posts: 240
Joined: Tue 24 Nov 2015 9:07 am
Weather Station: Davis Vantage Pro2
Operating System: Windows 11 64-bit
Location: Newton Poppleford, Devon, UK
Contact:

Re: Show All High Charts Instead Of A Selection

Post by Grimers »

I think that's what I said above, I didn't make it clear.

I've put the code above in several times, I'm still confused by the whole concept. Maybe it's not as hard as I think.
sfws
Posts: 1183
Joined: Fri 27 Jul 2012 11:29 am
Weather Station: Chas O, Maplin N96FY, N25FR
Operating System: rPi 3B+ with Buster (full)

Re: Show All High Charts Instead Of A Selection

Post by sfws »

Grimers wrote: I tried inserting this code:

Code: Select all
<div id="chartcontainer"></div>
multiple times into the trends page but the other instances just appeared as blank.
Any 'id' can only be used once in HTML. Because it finds the first id and used that, the rest are left blank.

You need a different id each time e.g.
<div id="chartcontainer1"></div>
<div id="chartcontainer2"></div>
<div id="chartcontainer3"></div>

and obviously change the code that puts the chart in to use the different ids.
Grimers
Posts: 240
Joined: Tue 24 Nov 2015 9:07 am
Weather Station: Davis Vantage Pro2
Operating System: Windows 11 64-bit
Location: Newton Poppleford, Devon, UK
Contact:

Re: Show All High Charts Instead Of A Selection

Post by Grimers »

Ok, thanks a lot, I'm managing to code it now.
Grimers
Posts: 240
Joined: Tue 24 Nov 2015 9:07 am
Weather Station: Davis Vantage Pro2
Operating System: Windows 11 64-bit
Location: Newton Poppleford, Devon, UK
Contact:

Re: Show All High Charts Instead Of A Selection

Post by Grimers »

Ok, I have the graphs in but only the Pressure graph shows, any ideas?

http://www.newton-poppleford-weather.co.uk/trends.htm
User avatar
mcrossley
Posts: 12689
Joined: Thu 07 Jan 2010 9:44 pm
Weather Station: Davis VP2/WLL
Operating System: Bullseye Lite rPi
Location: Wilmslow, Cheshire, UK
Contact:

Re: Show All High Charts Instead Of A Selection

Post by mcrossley »

In each function you have...

Code: Select all

    chart = new Highcharts.StockChart(options);
Which should be...

Code: Select all

    var chart = new Highcharts.StockChart(options);
... to control the scope of 'chart'.

BTW, why are you using StockChart to display a 'simple' chart, the standard 'chart' would be more efficent.
Grimers
Posts: 240
Joined: Tue 24 Nov 2015 9:07 am
Weather Station: Davis Vantage Pro2
Operating System: Windows 11 64-bit
Location: Newton Poppleford, Devon, UK
Contact:

Re: Show All High Charts Instead Of A Selection

Post by Grimers »

Aha! That's worked! Thanks very much!
mcrossley wrote:BTW, why are you using StockChart to display a 'simple' chart, the standard 'chart' would be more efficent.
I haven't changed that code...
tjaliwalpa
Posts: 293
Joined: Sun 18 Apr 2010 9:47 am
Weather Station: Davis VP2
Operating System: Linux Lite Ubuntu 16.04
Location: Karoonda, SA
Contact:

Re: Show All High Charts Instead Of A Selection

Post by tjaliwalpa »

I'm using an iPad to look at your trend page and have a suggestion. It's very difficult to scroll the page on a tablet as the scroll bar is so narrow. I'd suggest widening the scroll bar.

Bob
Bob
Mapantz
Posts: 1774
Joined: Sat 17 Dec 2011 11:55 am
Weather Station: Davis Vantage Pro2
Operating System: Windows 11 x64
Location: Dorset - UK
Contact:

Re: Show All High Charts Instead Of A Selection

Post by Mapantz »

tjaliwalpa wrote:I'm using an iPad to look at your trend page and have a suggestion. It's very difficult to scroll the page on a tablet as the scroll bar is so narrow. I'd suggest widening the scroll bar.

Bob
I don't think that's anything to do with the page, the scrollbar is standard on whatever browser you're using.

The one thing that I would change though, is having that meta refresh. There I was looking at the graphs, before I checked out the second one; page refreshes! It just made me close the page, as it is extremely annoying!
Image
tjaliwalpa
Posts: 293
Joined: Sun 18 Apr 2010 9:47 am
Weather Station: Davis VP2
Operating System: Linux Lite Ubuntu 16.04
Location: Karoonda, SA
Contact:

Re: Show All High Charts Instead Of A Selection

Post by tjaliwalpa »

Your probably right about the scroll bar @Mapantz.

Perhaps introduce a right margin of 5% and a left to balance things. This would allow tablet users to scroll the content using this space.

It's important to allow for touch screens in web design these days.

Bob
Bob
Grimers
Posts: 240
Joined: Tue 24 Nov 2015 9:07 am
Weather Station: Davis Vantage Pro2
Operating System: Windows 11 64-bit
Location: Newton Poppleford, Devon, UK
Contact:

Re: Show All High Charts Instead Of A Selection

Post by Grimers »

Sorry, but I've actually optimised the website for all devices so there's a problem with your device, it works fine on my iOS devices.

The meta refresh is there so that users don't have to manually refresh the page. Also, if they wish to view another website on another tab, it means that when they go back to the website on it's own tab, the data is current and not from when the page was last refreshed.
User avatar
mcrossley
Posts: 12689
Joined: Thu 07 Jan 2010 9:44 pm
Weather Station: Davis VP2/WLL
Operating System: Bullseye Lite rPi
Location: Wilmslow, Cheshire, UK
Contact:

Re: Show All High Charts Instead Of A Selection

Post by mcrossley »

My view is that a meta-refresh is the sledge hammer of last resort, it normally results in a horrible user experience. I'm not sure what you have the timer set to, but it should be reasonably long - 15 mins for the graphs would be fine I think, if you want realtime data then another screen may be more appropriate?
Grimers
Posts: 240
Joined: Tue 24 Nov 2015 9:07 am
Weather Station: Davis Vantage Pro2
Operating System: Windows 11 64-bit
Location: Newton Poppleford, Devon, UK
Contact:

Re: Show All High Charts Instead Of A Selection

Post by Grimers »

Sorry, but obviously I don't agree with this otherwise I wouldn't of implemented it, I'm not sure how a refresh once a minute results in a "horrible user experience". I can understand if it's several times a minute but not once a minute. I thank you for your advice but it is my website so I'd like to keep it as is.

Oh, and just to add, the users that visit my website have no problem with this implementation and actually think it's a good idea. :)
Mapantz
Posts: 1774
Joined: Sat 17 Dec 2011 11:55 am
Weather Station: Davis Vantage Pro2
Operating System: Windows 11 x64
Location: Dorset - UK
Contact:

Re: Show All High Charts Instead Of A Selection

Post by Mapantz »

I cannot scroll anywhere on your trends page, using a phone. The graphs take up the entire space and therefore they are the focus, which means you cannot scroll the page. The page needs space on either side of the graphs, so that the user can use a thumb or finger to to put the focus on the page and scroll up or down.
Image
Post Reply