CODEWITHSUNDEEP
javascriptjquerysetinterval
Thiyraash David
Thiyraash David

Reputation: 304

Auto refresh not working in javascript

I try to draw circular gauge using jQuery and circularchart and I'm able to make it.

I want the setInterval() function of javascript to auto-refresh the value so that the gauge value keep update by itself without manual refresh.

But the setinterval() function is not working at all.

I don't want to refresh the whole page or the body of html.

I just want to refresh the particular circleChart#0 function.

Your help is needed.

This is circle.html 

<body>
  <div class="circleChart" id="0"></div>
  <div class="circleChart" id="1" data-value="77"></div>
  <script src="{{ url_for('static', filename='jquery-1.12.4.min.js') }}"></script>
  <script src="{{ url_for('static', filename='circleChart.js') }}"></script>
  <script>
    $(".circleChart#1").circleChart();
    $(".circleChart#0").circleChart({
      size: 200,
      value: {{temperature}},
      text: 0,
      onDraw: function(el, circle) {
        circle.text(Math.round(circle.value) + "'C");
      }
    });


    setInterval(function() {
      $("#0").circleChart({
        value: {{temperature}},
        onDraw: function(el, circle) {
          circle.text(Math.round(circle.value) + "'C");
        }
      });
    }, 2000);
  </script>
</body>

</html>

This is my python code (main.py)

#!/usr/bin/python
from flask import Flask, render_template
app = Flask(__name__)


import os
import glob
import time

os.system('modprobe w1-gpio')
os.system('modprobe w1-therm')

base_dir = '/sys/bus/w1/devices/'
device_folder = glob.glob(base_dir + '28*')[0]
device_file = device_folder + '/w1_slave'

def read_temp_raw():
    f = open(device_file, 'r')
    lines = f.readlines()
    f.close()
    return lines

def read_temp():

    lines = read_temp_raw()
    while lines[0].strip()[-3:] != 'YES':
        time.sleep(0.2)
        lines = read_temp_raw()
        equals_pos = lines[1].find('t=')
        if equals_pos != -1:
        temp_string = lines[1][equals_pos+2:]
        temp_c = float(temp_string) / 1000.0
        temp_f = temp_c * 9.0 / 5.0 + 32.0
        return temp_c, temp_f

 @app.route("/")
 def main():
      temperature , humidity = read_temp()
      templateData = {
        'temperature' : temperature,
        'humidity': humidity
         }
      return render_template('circle.html', **templateData)

 if __name__ == "__main__":
    app.run(host='0.0.0.0', port=80, debug=True)

Upvotes: 0

Views: 353

Answers (1)

Niet the Dark Absol
Niet the Dark Absol

Reputation: 324620

Assuming {{temperature}} is some kind of template variable, those are (typically) only evaluated once when generating the page from your template.

You will need some kind of AJAX call to fetch the updated temperature value.

Upvotes: 2

Related Questions