Graphe fonctionnel avec bokeh pour les données par type (à améliorer, mais ça marche)

This commit is contained in:
Pierrick C 2017-10-01 18:14:12 +02:00
parent daf1053f7d
commit b5c32cfc15
3 changed files with 18 additions and 13 deletions

View File

@ -8,11 +8,11 @@
{% endblock %} {% endblock %}
{% block navbar %} {% block navbar %}
{{nav.top.render()}} {{nav.top.render()}}
{% endblock %} {% endblock %}
{% block body %} {% block body %}
{{super()}} {{super()}}
<div class="footer">-- by arofarn --</div> <div class="footer">-- by arofarn with the help of Flask --</div>
{% endblock %} {% endblock %}

View File

@ -3,16 +3,18 @@
{% block styles %} {% block styles %}
{{super()}} {{super()}}
{{ css_ressources }} {{ css_resources|safe }}
{{ js_ressources }} {{ js_resources|safe }}
{% endblock %} {% endblock %}
{% block content %} {% block content %}
{% from "bootstrap/pagination.html" import render_pagination %} {% from "bootstrap/pagination.html" import render_pagination %}
<div class="container"> <div class="container">
{{ plot_div|safe }} {{ plot_div|safe }}
<div id="graph"></div>
{{ render_pagination(dat) }} {{ render_pagination(dat) }}
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover"> <table class="table table-hover">
<thead class="thead-inverse"> <thead class="thead-inverse">
@ -41,6 +43,7 @@
{{ render_pagination(dat) }} {{ render_pagination(dat) }}
</div> </div>
</div> </div>
{{ plot_script|safe }} {{ plot_script|safe }}
{% endblock %} {% endblock %}

View File

@ -1,3 +1,4 @@
#!/usr/bin/python3
# -*- coding: utf-8 -*- # -*- coding: utf-8 -*-
""" """
Created on Thu Aug 17 22:25:52 2017 Created on Thu Aug 17 22:25:52 2017
@ -14,7 +15,7 @@ from flask import render_template
from flask_bootstrap import Bootstrap from flask_bootstrap import Bootstrap
from flask_nav import Nav from flask_nav import Nav
from flask_nav.elements import * from flask_nav.elements import *
import pandas as pd
from bokeh.plotting import figure from bokeh.plotting import figure
from bokeh.embed import components from bokeh.embed import components
from bokeh.models import ColumnDataSource from bokeh.models import ColumnDataSource
@ -77,26 +78,27 @@ def all_data():
@app.route('/type_id=<dt>') @app.route('/type_id=<dt>')
def by_data_type(dt): def by_data_type(dt):
date_deb = datetime.utcnow()-timedelta(seconds=3600) date_deb = datetime.now()-timedelta(hours=1)
#Récupération des données à afficher #Récupération des données à afficher
res = Data.query.filter(Data.type_id == dt).filter(Data.dbdate >= date_deb).order_by(Data.valdate) q = Data.query.filter(Data.type_id == dt).filter(Data.dbdate >= date_deb).order_by(Data.valdate)
res = pd.read_sql(q.selectable, db.engine)
plot_data = ColumnDataSource(data=dict(x = res.values('valdate'), y = res.values('value'))) plot_data = ColumnDataSource(data=dict(x = res['data_valdate'], y = res['data_value']))
#Préparation du graphique #Préparation du graphique
data_plot = figure(tools = TOOLS, data_plot = figure(tools = "hover,pan,reset,save,wheel_zoom",
title = dt, title = dt,
x_axis_label = 'Date', x_axis_label = 'Date',
x_axis_type = 'datetime', x_axis_type = 'datetime',
y_axis_label = dt, y_axis_label = dt,
plot_height = 400, plot_height = 400,
plot_width = 800, plot_width = 1140,
) )
data_plot.line('x', 'y', source=plot_data, line_width=2) data_plot.line('x', 'y', source=plot_data, line_width=2)
script, div = components(data_plot) script, div = components(data_plot)
return render_template('data_graph.html.j2', dat=res.order_by(Data.dbdate.desc()).paginate(per_page=15), return render_template('data_graph.html.j2', dat=q.order_by(Data.dbdate.desc()).paginate(per_page=15),
plot_script=script, plot_script=script,
plot_div=div, plot_div=div,
js_resources=js_resources, js_resources=js_resources,