Author Topic: SteelSeries Gauges: Adding Cloud Base  (Read 2074 times)

Offline eichmat

  • New member
  • *
  • Posts: 2
    • Hokendauqua Weather
SteelSeries Gauges: Adding Cloud Base
« on: April 27, 2017, 02:27:34 PM »
Has anyone taken the time to try to add a Cloud Base gauge to Mark's Steel Series set?  I see that CMX has it in the web-UI and would love to add that to my public facing page.

If not, I guess I can muddle through and see about doing that myself (I was a software developer by trade, though not PHP [now I'm a paper-pusher and contractor wrangler that is plugged into a phone most of the day...  :'( ).

Thanks,


Offline Andy9164

  • Full Member
  • ***
  • Posts: 87
    • Midlifedad
Re: SteelSeries Gauges: Adding Cloud Base
« Reply #1 on: April 28, 2017, 09:39:39 AM »
Hi eichmat,

There is already a cloudbase gauge.

If you open your gauges.php page with an editor and look for the section that looks like below. Then add the section in green
</div>
            <div id="tip_3" class="gauge box_img3">
               <canvas id="canvas_rrate" class="gaugeSizeLrg"></canvas>
               <h3>Rainfall rate</h3>
            </div>
         </div>
         <div class="row" style="height: 410px;">
            <div id="tip_11" class="gauge box_img3">
               <canvas id="canvas_cloud" class="gaugeSizeLrg"></canvas>
               <h3>Cloudbase</h3>
            </div>
         </div>

         <div class="row" style="height: 410px;">
            <div class="gauge box_img3">
               <h3>Settings</h3><br />
               <p><strong>&nbsp;Measurements unit</strong></p><br>
               <div class="unitsTable">
                  <div style="display:table-row; line-height: 30px;">
                     <div id="temperature" class="cellRight">
                        <span id="lang_temperature">Temperature</span>:&nbsp;
                     </div>
                     <div style="display:table-cell">
                        <input id="rad_unitsTemp1" type="radio" name="rad_unitsTemp" value="C" checked onclick="gauges.setUnits(this);"><label id="lab_unitsTemp1" for="rad_unitsTemp1">&deg;C</label>
                     </div>
                     <div style="display:table-cell">
                        <input id="rad_unitsTemp2" type="radio" name="rad_unitsTemp" value="F" onclick="gauges.setUnits(this);"><label id="lab_unitsTemp2" for="rad_unitsTemp2">&deg;F</label>
                     </div>

Here is a link to my gauges page. Cloudbase is down at the bottom.

http://www.midlifedad.me.uk/weather/gauges.php

Andy
« Last Edit: April 28, 2017, 10:02:38 AM by Andy9164 »

Offline eichmat

  • New member
  • *
  • Posts: 2
    • Hokendauqua Weather
Re: SteelSeries Gauges: Adding Cloud Base
« Reply #2 on: April 28, 2017, 11:53:11 AM »
Missed that on the code (then again, it's was late when I looked through it). 

And I love the gold dials on your site.  I need  to hack the templates a bit more.  I just switched to Cumulus from VWS a few months ago after Wunderground shut down the services that supplied forecast dataused by VWS.

Thank you,


Tim


Offline Andy9164

  • Full Member
  • ***
  • Posts: 87
    • Midlifedad
Re: SteelSeries Gauges: Adding Cloud Base
« Reply #3 on: April 28, 2017, 02:14:43 PM »
No problem. I think you need to be running Version 2.5.0 or higher for cloudbase gauge to work.

http://wiki.sandaysoft.com/a/SteelSeries_Versions

You can change how the gauges look by editing the gauges.js file in the // Gauge global look'n'feel settings section. See here for options.

http://wiki.sandaysoft.com/a/SteelSeries_FAQ#Design_customizations

There used to be web page where you could try these out so you could pick your design rather than doing trial error. If I find it I will post.

That was easy

http://www.wilmslowastro.com/steelseries/demoRadial.html

Look forward to seeing cloudbase gauge on your website.

Andy

« Last Edit: April 28, 2017, 02:18:49 PM by Andy9164 »

Offline Walapanut

  • New member
  • *
  • Posts: 2
Re: SteelSeries Gauges: Adding Cloud Base
« Reply #4 on: November 20, 2017, 09:27:32 PM »
Thanks for the link and the code. It helped me a lot.