Started by Dixon MurrayNov 5, 2021

Open
Passing ajax-requested data into Python function

0 VIEWES 0 LIKES 0 DISLIKES SHARE
0 LIKES 0 DISLIKES 0 VIEWES SHARE

The flask utility underneath makes ajax calls indefinitely to a back-cease index characteristic which queries an information base and injects results into the template.

I'm waiting for that, after ajax is finished, the injected information may be refreshed hence updating the plot but it's now not.

The way to replace ajax in a manner that refreshes the injected records into 'index.Html' (subsequently updating plot which consumes those records)?

HTML code:-

<div class="card-body">
    <div  class="chart-area">
       <div id = 'load' class = 'chart' style = 'height:100%'></div> <!--This is where chart appears -->
     </div>
   </div>

Jquery code:-

<script> 
    $(document).ready(function(){
        function ajaxCall(){
            $.ajax({
                async: false,
                type: 'POST',
                url: '/',
                dataType: 'json',
                contentType: 'application/json;charset=UTF-8',
                success: function (data) {
                  ??? perhaps something here???
                    }
            });
        }
    setInterval(ajaxCall, 2000); // repeatedly calls ajaxCall()
    var graphs = {{graphJSON | safe}}; // saves injected data to variable
    Plotly.plot('load',graphs,{}); // passes saved variable to Python function for plotting which then appears in div with 'load' id above.
    });
</script>

Flask code:-

from flask import render_template, Blueprint,  
from App.functions.reddit_streamer import AWS_RDB
import json
import plotly
import plotly.express as px
core = Blueprint('core', __name__)
@core.route('/', methods = ['GET', 'POST'])
def index():
    db = AWS_RDB()
    df = db.query_half_hour()
    fig = px.line(df.loc[1:,:], x = 'date' , y = '# of comments')
    graphJSON = json.dumps(fig, cls = plotly.utils.PlotlyJSONEncoder)
    return render_template('index.html', graphJSON = graphJSON)

0 Replies

You must be Logged in to reply
Trending Categories
15
Software39
DevOps45
Frontend Development24
Backend Development20
Server Administration17
Linux Administration24
Data Center24
Sentry24
Terraform21
Ansible29
Docker28
Penetration Testing14
Kubernetes16
NGINX19
JenkinsX17
Techiio

Techiio is on the journey to build an ocean of technical knowledge, scouring the emerging stars in process and proffering them to the corporate world.

Follow us on:

facebooklinkdeintwitter

Subscribe to get latest updates

You can unsubscribe anytime from getting updates from us
Copyright techiio.com @2020 Kolkata, India
made with by Abhishek & Priyanka Jalan
Copyright techiio.com @2020
made with by Abhishek & Priyanka Jalan