Cumulus Support

Hi all,

I have just recently began using Cumulus to upload my weather data to the web:

http://tuamweather.com/

It was a steep learning curve for me as this is the first time I have dealt with such technical complexities! but I eventually got it sorted.

I would like to ask advice, should anybody be in the know, if it is possible to tweak parameters that show up in the default template? For example, I would like to ditch variables such as 'solar radiation' and 'evaporation today' and instead replace them with temperature trend and other more useful data. I cannot for the life of me figure out how to do this so if anyone could advise I would be exceptionally grateful!


Also, is it possible to edit the default graphs on the 'graphs' page? I would like to be more selective about which graphs show up, and also, would it be possible to change the extremes on the 'barometer graph'?



As you can see, span of values on the baro graph are very extreme and I like, if possible, to set the low extreme from 820 mb to a more traditional 940mb or thereabouts, as this would be more befitting for my location as pressure values rarely if ever fall below this.

I realise there is a lot of questions here but if anybody out there could advise it would mean a lot and would be much appreciated

Thanks in advance for any help and advice offered

Patrick G.

There's some information in the wiki about modifying the default web pages. As it says there, some understanding of HTML is useful! http://wiki.sandaysoft.com/a/Customised_templates

I can't remember much about those 'static' gauges, I imagine that it might be possible to change the extremes on the barometer gauge but this would probably require editing javascript. Those gauges should really be regarded as deprecated, and I strongly suggest that you look at the SteelSeries gauges instead. More learning to do, but well worth it. http://wiki.sandaysoft.com/a/SteelSeries_Gauges

You can change which graphs are displayed on the graphs page, again by editing the HTML (in the trendsT.htm template in this case).

If you have a look at the documentation and ask questions if/when you get stuck, someone will be happy to help.

Thanks for those links Steve, I'll give them a read through and let you know how it goes!

From what I remember that barometer uses a graphic image for the scale, so you would need to create a new one as well as alter the JavaScript code.

Very interesting, thanks Mcrossley! I am currently having a look through the HTML and JS files, and while the HTML scripts seem straight forward enough, the JS ones are frightening to look at.

Creating a new image for the barometer sounds like a plan. I think this would be easy enough, using the same design as the original (I actually like it) but it would be the tweaking of the JS script to correspond with the image that will make this task very challenging, but a challenge I'll grab by the ...

Thanks for the tip and hopefully I can get this tweaked successfully with time and patience.

I have a vague memory that I did this myself years ago, I'll see if I have a backup of the files tucked away somewhere when I get home - it's a long shot mind...

Much appreciated Mcrossley, this would be a great help if do happen to find those old files as it would give me a solid guidance as to where to start!

It's your luck day! I found an archive on my Google drive with the files.

So the zip not only has a barometer that runs from 950 to 1050, I also have the code to use it - I think, I haven't looked too closely.

As a bonus I redrew lots of the other gauges, I haven't looked if the code runs all of them, but there is even a log scaled wind speed and rain rate. Use what you like and toss the rest!

Mcrossley, this is brilliant!! Many many thanks for rooting those out for me and thanks for passing them on Your redrawn barometer face is exactly what I was looking for and hopefully with the scripts you provided, I can get this tweaked to the last.

I am going to go full on with this project over weekend and hopefully I won't mess anything up (though no doubt I will) but will report back if and when it is complete.

Many thanks again for all your help Mcrossley and for sharing your own work with me.
Cheers!
Patrick

Hi MCrossely.

After spending much of the day trying to figure out how to replace the original Baro image with the one you kindly provided, I eventually worked it out (after basically destroying all the graphs on the 'Gauges' page more than once - it is lucky I kept a copy of the original 'dbimages' folder) by changing the JS query to recognise the .png image as opposed to the .gif

tgd="<div id='barometer' style='"+fst+"width:220px; height:180px;'><img src='dbimages/barometer2.png'></div>";

And here how it looks now (I added some 'traditional' text to it to give it a more authentic feel, which admittedly looks a bit cluttered and nasty at this stage but will make this 'nicer' looking in the near future.



The problem I have now is actually getting the actual baro needle to correspond with the values on the new barometer. On two occasions, I replaced the 'baro function script' in the 'Dashboard' JS with the baro function script you provided in the 'Gauges_canvas' JS file. Unfortunately, this resulted in the barometer image to go missing completely off the main gauge page (which is more likely down to something I did than to the script itself)

Comparing the two baro scripts mentioned above, the one you provided seems to be structurally different to the original one and contains not only some additional code, but also, in some cases, less code that what is seen in the original 'dashboard' and as a result, and due entirely to the severe limits of my understanding, it has become overwhelming for me to work out how tweak how the baro needle can be made to correspond with the values on the new barometer.

I would like to ask you if you would not mind taking a look a the original baro function code (contained within the dashboard JS script) and let me know if it is actually possible to change how the needle moves in relation to the new baro image? as there is just so much going on in the code that I cannot even begin to comprehend which part is to be changed

Here is the actual 'dobar' function' JS script from the original 'dashboard'


function dobar(type){
if(type=="analog"){
abtc=AnalogBaroTextColor;abnc=AnalogBaroNeedleColor;
tgd="<div id='barometer' style='"+fst+"width:220px; height:180px;'><img src='dbimages/barometer2.png'></div>";
document.getElementById("barometer").parentNode.innerHTML=tgd;
var jg=new jsGraphics("barometer");
jg.drawImage('dbimages/'+bardata[5]+'.gif',70,97,9,29);
val=0;
if(parseFloat(bardata[0])<100){
val=Math.ceil(bardata[0]/0.029528750668088)-565;
}else{
val=parseInt(bardata[0])-565;
}
to=getpixel(110,110,63,val,2);
jg.setColor(abnc || "#990000");
jg.setStroke(2);
jg.drawLine(110,110,to[0],to[1]);
jg.drawEllipse(103,103,14,14);
jg.setColor("#999999");jg.fillEllipse(105,105,12,12);
jg.setFont("verdana","9px",Font.PLAIN);
jg.setColor(abtc || "#555555");
jg.drawStringRect("Now: "+parseFloat(bardata[0]),60,138,100,"center")
jg.setFont("verdana","9px",Font.PLAIN);
jg.setColor(abtc || "#555555");
jg.drawStringRect("Max: "+parseFloat(bardata[3]),60,150,100,"center")
jg.setFont("verdana","9px",Font.PLAIN);
jg.setColor(abtc || "#555555");
jg.drawStringRect("Min: "+parseFloat(bardata[4]),60,162,100,"center")
mo[0]="Current:"+bardata[0]+" "+bardata[1];
mo[1]="Max Today:"+parseFloat(bardata[3])+" "+bardata[1];
mo[2]="Min Today:"+parseFloat(bardata[4])+" "+bardata[1];
mo[3]="Trend:"+bardata[2];
document.getElementById("barometer").title="header=[Barometer ("+bardata[1]+")] body=["+getmo(mo)+"] delay=["+mod+"]";
}else{
w=90;
h=100;
tgd="<div id='barometer' style='"+fst+"width:"+w+"px; height:"+h+"px;'></div>";
document.getElementById("barometer").parentNode.innerHTML=tgd;
var jg=new jsGraphics("barometer");
jg.setColor("#AAAAAA");
jg.fillRect(0,0,w,h);
jg.setColor("#DDDDDD");
jg.fillRect(5,5,w-10,23);
jg.setColor("#FEFEFE");
jg.drawLine(0,0,w,0);
jg.setColor("#FEFEFE");
jg.drawLine(0,0,0,h);
jg.setColor("#000000");
jg.drawLine(1,h,w,h);
jg.setColor("#000000");
jg.drawLine(w,h,w,1);
jg.setColor("#FEFEFE");
jg.drawLine(5,28,w-5,28);
jg.setColor("#FEFEFE");
jg.drawLine(w-5,5,w-5,28);
jg.setColor("#000000");
jg.drawLine(5,5,w-5,5);
jg.setColor("#000000");
jg.drawLine(5,5,5,28);
jg.setFont("verdana","18px",Font.BOLD);
jg.setColor("#000000");
jg.drawStringRect(bardata[0],5,5,w-10,"center");
jg.setFont("verdana","9px",Font.PLAIN);
jg.setColor("#FFFFFF");
jg.drawStringRect(bardata[1],5,36,70,"left");
jg.drawImage('dbimages/'+bardata[5]+'.gif',w-14,35,9,29);
jg.setFont("verdana","9px",Font.PLAIN);
jg.setColor("#FFFFFF");
jg.drawStringRect(bardata[2],5,50,70,"left");
jg.setFont("verdana","9px",Font.PLAIN);
jg.setColor("#FFFFFF");
jg.drawStringRect("Max: "+parseFloat(bardata[3]),5,70,w-10,"center");
jg.setFont("verdana","9px",Font.PLAIN);
jg.setColor("#FFFFFF");
jg.drawStringRect("Min: "+parseFloat(bardata[4]),5,82,w-10,"center");
}
jg.paint();
}

If it is possible, could you please possibly advise which section of the code I should be looking at to change how the needle works with the new baro image. Thank you greatly in advance for any advice you may have to offer.

Pat.

Now, you're asking!

As the scale is smaller and starts at a different value, you will need to scale the value up a bit (ratio of old scale range to new), and subtract a different mid-range value.

So where it has...
val=parseInt(bardata[0])-565;

You will have to work out where the magic number 565 comes from, and what to change it to, and possibly multiply the value parseInt(bardata[0]) by 2.5 - from 250/100, the ratio of the ranges.

All complete guess work, I can't see where 565 comes from. I see in my rewrite I changed it to use a scaling value and offset based on the gauge. Maybe I couldn't work out the magic then either!

I have found lots of versions of those scripts now. What I can't find are the very first versions where I used the original script modded to the new scales.

I experimented with different barometer graphics several years ago. I took inspiration at the time from Mark's early work he has mentioned. if you want more hints, I will look out ancient code

Mcrossley and SFWS, very much thankful for your replies and helpful advice

When it comes the JS, I just freak out. HTML I can just about handle, but JS just seems so nasty, as it would seem to require a more 'mathematical' brain and understanding of the world, which I never had

Thanks Mcrossley for pointing out the section of code that I am to look at, though I admit the requirements are every bit as daunting as the code itself but will try to work it out. And nice one SFWS for sharing your own code with me as I may just make understanding what I need to do just a little bit easier, and great graphs by the way!!

Cheers lads!

Patrick

Well after many attempts, I have failed, due to my own limitations to understand JS, to be able to get the desired result, but a big thank you to all who offered their advice and sharing of their own scripts as guidelines.

For now, I have downloaded and uploaded the 'Steel Gauges' and they seem to be doing the job nicely (and they also work on mobile as they don't require flash)

http://tuamweather.com/gauges-ss.htm

If I could ask for one more bit of help as the gauges only update every 10 seconds, despite the fact that I have set the upload interval on the main Cumulus package, and on the HTML 'realtime' script, to 5 seconds. The counter itself counts down every 5 seconds but the graphs themselves (wind/temp etc) only update every 10 seconds. I have read through other threads on this forum on the Steel Gauges to see if there was a solution, and while I did come across one such post, the solution did not work in my case (which is more likely down to me)

If anyone has any advice or tips to sort out this first world problem I would be very grateful,
Thanks!

Your realtimegauges.txt updates mostly every 10 seconds, but very occasionally after 5 seconds. The most likely explanation is that it takes more than 5 seconds to do each realtime update. You could turn on ftp logging and look at realtimeftplog.txt to confirm this. If you are no longer using realtime.txt you could turn off realtime.txt uploading.