Multiple Gauges from different stations on the same page?

As the title say, is that possible in some way?

I have tried different things on the code, but can’t seem to find a way to call for example 2 different Temp gauges and get different data for each one.

Situation is like this:

I have 2 stations with WD/Customclientraw in those paths

meteokav.gr/weather/ssg/ Station 1
meteokav.gr/vounochori/ssg/ Station 2

And I want to display 2 temp gauges on my homepage https://www.meteokav.gr/index2.php (index2 is just a test index until I find a solution)

On index2.php I have


<!-- SSG Tools/API -->
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="weather/ssg/scripts/steelseries_tween.min.js"></script>
<script src="weather/ssg/scripts/language.min.js"></script>
<script src="weather/ssg/scripts/gauges-main-el.js"></script>   <-- Station 1
<script src="vounochori/ssg/scripts/gauges-main-el.js"></script> <--- Station 2
<script src="weather/ssg/scripts/RGraph.common.core.min.js"></script>
<script src="weather/ssg/scripts/RGraph.rose.min.js"></script>

And in order to call the 2 different gauges for station 1:


    <div class="row">
                      <div id="tip_0" class="gauge">
                         <canvas id="canvas_temp" class="gaugeSizexSml" width="150" height="150"></canvas>
                </div>

Which is working fine, its basically the 1st station in /weather/

However the station in /vounochori/ doesnt seem to get data, the gauge graphic loads fine though.


<div class="row">
                      <div id="tip_0" class="gauge">
                         <canvas id="canvas_temp2" class="gaugeSizexSml" width="150" height="150"></canvas>
         </div>

As you can see in the 2nd station I tried to change the id into “canvas_temp2” and at the same time I changed all the “canvas_temp” in the vounochori/ssg/scripts/gauges-main-el.js into → canvas_temp2.

I also have tried to include the different ssg setups via

Any ideas around this situation? Not sure if this is possible at all in a simple way but yeah, any help would be really appreciated :slight_smile:

You could be in for a bit of digging here!

First thing I would say is that the two scripts have a name clash. The scripts try to keep all their variables private by encapsulating the code within an immediate function.

So, at the top of teh script you have…

var gauges = (function () {

In you second script change that to…

var gauges2 = (function () {

Another problem, the script uses jQuery to perform the AJAX queries. It assumes it has sole access, so the two scripts will interfere with each other - e.g. line 2616…

if ($.active > 0)

$.active will be greater than zero if the “other” script is currently running a query. :frowning:

Horrible hack - just comment out the following _jqXHR.abort(); command!

With those two changes the gauges function - how reliably though…

Mark! It’s magic! :o

Thank you very much, seems like everything working :slight_smile: If I see anything weird I will report back. Actually is there something that might break after a while?

Best regards! :slight_smile:

Up and running, not 2 but 4 stations! :lol: Let’s see how this will turn around :slight_smile:

https://www.meteokav.gr/

Again, many thanks Mark!