Courtney_ulster
Courtney_ulster

Reputation: 21

How can I get my bokeh map to appear on my Django application

i have been using the jupyter notebook to make some visualisations using my csv file. i need to be able to show this map on my django web app but have no idea how to go about that.

I have tried putting the code into my views file and rendering this to my html file but i dont know how to use my csv file in this case.

import bokeh 
import pandas as pd
from bokeh.io import output_notebook, show
from bokeh.plotting import figure
from bokeh.models import ColumnDataSource, HoverTool
from bokeh.transform import linear_cmap
from bokeh.palettes import Spectral6, RdYlGn, viridis, Plasma256, RdYlGn10, YlOrRd4, Reds9
from bokeh.tile_providers import CARTODBPOSITRON_RETINA
from pygeotile.point import Point
output_notebook()
%matplotlib inline

pred = r'path'
pred = pd.read_csv(pred)

for index, row in pred.iterrows():
        point = Point.from_latitude_longitude(latitude=row['Latitude'], longitude=row['Longitude'])
        pred.at[index,'x'] = point.meters[0]
        pred.at[index,'y'] = point.meters[1]
        pred.at[index,'size'] = 15 # int(row[bnf]/100)

p = figure(plot_width=900, plot_height=400, 
           x_axis_type="mercator", 
           y_axis_type="mercator",
           x_range=(-928267, -573633), 
           y_range=(7168390, 7422161))
p.add_tile(CARTODBPOSITRON_RETINA)

mapper = linear_cmap(field_name='type', palette=Spectral6,low=0 ,high=1)

source = ColumnDataSource(pred_crime)
p.circle(x='x', y='y', source=source, size='size', fill_color=mapper, line_alpha=0.5, line_color='black')
p.add_tools(HoverTool(tooltips=[("type","Type")]))
show(p)

i want to know where to put these files and what i need to change to get it working in pycharm

Upvotes: 2

Views: 164

Answers (1)

Tony
Tony

Reputation: 8297

This should work for you. Put index.html in templates directory.

index.html

<!DOCTYPE html>
<html lang='en'>
    <head>
        {{ resources | safe }}
        <title>testing bokeh...</title>
    </head>  
    <body>
        {{ div | safe }}
        {{ script | safe }}
    </body>
</html>

django_app.py

import pandas as pd
from bokeh.plotting import figure
from bokeh.models import ColumnDataSource, HoverTool
from bokeh.transform import linear_cmap
from bokeh.palettes import Spectral6, RdYlGn, viridis, Plasma256, RdYlGn10, YlOrRd4, Reds9
from bokeh.tile_providers import CARTODBPOSITRON_RETINA
from pygeotile.point import Point
from bokeh.embed import components
from bokeh.resources import INLINE
from django.shortcuts import render_to_response

#output_notebook()
#%matplotlib inline

pred = r'path'
pred = pd.read_csv(pred)

for index, row in pred.iterrows():
        point = Point.from_latitude_longitude(latitude=row['Latitude'], longitude=row['Longitude'])
        pred.at[index,'x'] = point.meters[0]
        pred.at[index,'y'] = point.meters[1]
        pred.at[index,'size'] = 15 # int(row[bnf]/100)

p = figure(plot_width=900, plot_height=400, 
           x_axis_type="mercator", 
           y_axis_type="mercator",
           x_range=(-928267, -573633), 
           y_range=(7168390, 7422161))
p.add_tile(CARTODBPOSITRON_RETINA)

mapper = linear_cmap(field_name='type', palette=Spectral6,low=0 ,high=1)

source = ColumnDataSource(pred_crime)
p.circle(x='x', y='y', source=source, size='size', fill_color=mapper, line_alpha=0.5, line_color='black')
p.add_tools(HoverTool(tooltips=[("type","Type")]))
script, div = components(p)
return render_to_response('index.html', {'resources' = INLINE.render(), 'script': script, 'div': div})

Upvotes: 2

Related Questions