comment intégrer des graphiques bokeh autonomes dans les modèles django
je veux afficher les graphiques offerts par la bibliothèque bokeh dans mon application web via le framework django mais je ne veux pas utiliser l'exécutable bokeh-server parce que ce n'est pas la bonne façon. donc, est-ce possible? si oui comment le faire?
5 réponses
Intégration De Flou D'Arrière-Plan Des Parcelles exemple de documentation comme suggéré par Fabio Pliger, on peut le faire en Django:
dans le views.py dossier, nous avons mis:
from django.shortcuts import render
from bokeh.plotting import figure
from bokeh.resources import CDN
from bokeh.embed import components
def simple_chart(request):
plot = figure()
plot.circle([1,2], [3,4])
script, div = components(plot, CDN)
return render(request, "simple_chart.html", {"the_script": script, "the_div": div})
dans le urls.py le fichier que nous pouvons mettre :
from myapp.views import simple_chart
...
...
...
url(r'^simple_chart/$', simple_chart, name="simple_chart"),
...
...
dans le fichier template simple_chart.html nous aurons :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Experiment with Bokeh</title>
<script src="http://cdn.pydata.org/bokeh/release/bokeh-0.8.1.min.js"></script>
<link rel="stylesheet" href="http://cdn.pydata.org/bokeh/release/bokeh-0.8.1.min.css">
</head>
<body>
{{ the_div|safe }}
{{ the_script|safe }}
</body>
</html>
et ça marche.
vous n'avez pas besoin d'utiliser bokeh-server pour intégrer bokeh plots. Cela signifie simplement que vous n'utiliserez pas (et probablement pas besoin) les fonctionnalités supplémentaires qu'il fournit.
en fait, vous pouvez intégrer les tracés bokeh de plusieurs façons, comme générer du html autonome, en générant des composants bokeh autonomes que vous pouvez ensuite intégrer dans votre application django lors du rendu de gabarits ou avec la méthode que nous appelons "autoloading" qui fait que bokeh renvoie une balise qui se remplacera par un traceur Bokeh. Vous trouverez de meilleurs détails en regardant le documentation.
une autre bonne source d'inspiration est le incorporer des exemples vous pouvez trouver dans le référentiel.
Il faut mettre {{the_script|coffre-fort}} à l'intérieur de la tête la balise
il est également possible de le faire fonctionner avec des requêtes AJAX. Supposons que nous ayons une page chargée et que nous souhaitions afficher un graphique en cliquant sur le bouton sans recharger la page entière. De Django vue de nous retourner le Bokeh de script et de div en JSON:
from django.http import JsonResponse
from bokeh.plotting import figure
from bokeh.resources import CDN
from bokeh.embed import components
def simple_chart(request):
plot = figure()
plot.circle([1,2], [3,4])
script, div = components(plot, CDN)
return JsonResponse({"script": script, "div": div})
lorsque nous obtenons une réponse AJAX dans JS (dans cet exemple Jquery est utilisé), le div est d'abord ajouté à la page existante, puis le script est ajouté:
$("button").click(function(){
$.ajax({
url: "/simple_chart",
success: function(result){
var bokeh_data = JSON.parse(result);
$('#bokeh_graph').html(bokeh_data.div);
$("head").append(bokeh_data.script);
}});
});
Voici un Flasque app qui utilise jquery pour interagir avec une parcelle de bokeh. Découvrez templates/ pour javascript, vous pouvez réutiliser. Cherchez aussi bokeh-demos sur github.