If you use Cumulus, please donate Image

Please read this post before posting

Latest Cumulus release v1.9.4 (build 1099) - Nov 28 2014
Latest Cumulus MX release - v3.0.0 build 3043 Jan 20 2017. See this post for download

Show All High Charts Instead Of A Selection

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

Moderators: daj, TNETWeather

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

Show All High Charts Instead Of A Selection

Postby Grimers » Tue Oct 04, 2016 10:01 am

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
William Grimsley.

jlmr731
Posts: 84
Joined: Sat Aug 27, 2016 12:11 am
Weather Station: Davis vantage pro 2
Operating System: Linux Ubuntu / windows 10
Location: Youngstown, Ohio
Contact:

Re: Show All High Charts Instead Of A Selection

Postby jlmr731 » Tue Oct 04, 2016 12:06 pm

i believe you will have to replicate that part of the code for each chart

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

Re: Show All High Charts Instead Of A Selection

Postby Grimers » Tue Oct 04, 2016 8:31 pm

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.
William Grimsley.

sfws
Posts: 300
Joined: Fri Jul 27, 2012 11:29 am
Weather Station: Mixed manufacturers
Operating System: off-line W10 pc
Location: UK

Re: Show All High Charts Instead Of A Selection

Postby sfws » Tue Oct 04, 2016 8:55 pm

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.

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

Re: Show All High Charts Instead Of A Selection

Postby Grimers » Tue Oct 04, 2016 8:59 pm

Ok, thanks a lot, I'm managing to code it now.
William Grimsley.

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

Re: Show All High Charts Instead Of A Selection

Postby Grimers » Tue Oct 04, 2016 9:58 pm

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

http://www.newton-poppleford-weather.co.uk/trends.htm
William Grimsley.

User avatar
mcrossley
Posts: 4854
Joined: Thu Jan 07, 2010 9:44 pm
Weather Station: Davis VP2
Operating System: Jessie Lite rPi
Location: Wilmslow, Cheshire, UK
Contact:

Re: Show All High Charts Instead Of A Selection

Postby mcrossley » Wed Oct 05, 2016 9:22 am

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.

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

Re: Show All High Charts Instead Of A Selection

Postby Grimers » Wed Oct 05, 2016 10:08 am

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...
William Grimsley.

tjaliwalpa
Posts: 293
Joined: Sun Apr 18, 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

Postby tjaliwalpa » Wed Oct 05, 2016 10:15 pm

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

User avatar
Mapantz
Posts: 404
Joined: Sat Dec 17, 2011 11:55 am
Weather Station: Davis Vantage Pro2
Operating System: Windows 10 x64 - A beast.
Location: Wareham, Dorset - UK

Re: Show All High Charts Instead Of A Selection

Postby Mapantz » Wed Oct 05, 2016 10:58 pm

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
Image

tjaliwalpa
Posts: 293
Joined: Sun Apr 18, 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

Postby tjaliwalpa » Wed Oct 05, 2016 11:21 pm

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

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

Re: Show All High Charts Instead Of A Selection

Postby Grimers » Thu Oct 06, 2016 9:00 am

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.
William Grimsley.

User avatar
mcrossley
Posts: 4854
Joined: Thu Jan 07, 2010 9:44 pm
Weather Station: Davis VP2
Operating System: Jessie Lite rPi
Location: Wilmslow, Cheshire, UK
Contact:

Re: Show All High Charts Instead Of A Selection

Postby mcrossley » Thu Oct 06, 2016 9:06 am

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?

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

Re: Show All High Charts Instead Of A Selection

Postby Grimers » Thu Oct 06, 2016 11:10 am

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. :)
William Grimsley.

User avatar
Mapantz
Posts: 404
Joined: Sat Dec 17, 2011 11:55 am
Weather Station: Davis Vantage Pro2
Operating System: Windows 10 x64 - A beast.
Location: Wareham, Dorset - UK

Re: Show All High Charts Instead Of A Selection

Postby Mapantz » Thu Oct 06, 2016 11:16 am

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
Image


Return to “Web site - General”

Who is online

Users browsing this forum: No registered users and 4 guests