django前后端结合_简单4步用FLASK/Django部署你的Pyecharts项目
文章首發(fā)公眾號(hào):早起python
前言
為什么將pyecharts與web框架結(jié)合使用?因?yàn)槿绻皇菃渭兊氖褂胮yecharts,我們展示的時(shí)候只能將我們的圖表生成為靜態(tài)文件,雖然也在也可以使用iframe等語(yǔ)句嵌入前端頁(yè)面但是并不方便前后端數(shù)據(jù)交互。
如果我們?cè)贔lask/Django/Tornado/Sanic中使用pyecharts就結(jié)合通過這些web框架來(lái)實(shí)現(xiàn)前后端分離或使用動(dòng)態(tài)更新數(shù)據(jù),增量更新數(shù)據(jù)(比如前端主動(dòng)向后端進(jìn)行數(shù)據(jù)刷新等)等功能。進(jìn)一步可以購(gòu)買一個(gè)服務(wù)器去將項(xiàng)目部署在服務(wù)器上,這樣就能隨時(shí)隨地展示你的數(shù)據(jù)分析可視化結(jié)果,而這一切并不困難。例如我們之前做過疫情可視化網(wǎng)站就是Django+pyecharts實(shí)現(xiàn)
本文主要介紹如何在本地結(jié)合Flask/Django使用pyecharts。
在Flask中使用
step1
新建一個(gè)flask項(xiàng)目
Flask的安裝可以使用pip install flask首先我們建立一個(gè)文件夾pyecharts-flask-demo然后進(jìn)入這個(gè)這個(gè)文件夾中再建一個(gè)新的文件夾templates這樣我們就為我們接下來(lái)的flask項(xiàng)目創(chuàng)建了一個(gè)目錄。
step2
拷貝pyecharts模版
將 pyecharts 模板,位于官方GitHub中的 pyecharts.render.templates 全部文件拷貝至剛新建的 templates 文件夾。
step3
渲染模版
在這一步我們只要在文件夾pyecharts-flask-demo也就是主目錄下創(chuàng)建創(chuàng)建一個(gè)python腳本命名為server.py并填入以下代碼,當(dāng)然中間的繪圖部分代碼可以替換為自己的繪圖部分代碼
from flask import Flask from jinja2 import Markup, Environment, FileSystemLoader from pyecharts.globals import CurrentConfig# 關(guān)于 CurrentConfig,可參考 [基本使用-全局變量] CurrentConfig.GLOBAL_ENV = Environment(loader=FileSystemLoader("./templates"))from pyecharts import options as opts from pyecharts.charts import Barapp = Flask(__name__, static_folder="templates")#########################以下代碼可以替換!!! def bar_base() -> Bar:c = (Bar().add_xaxis(["襯衫", "羊毛衫", "雪紡衫", "褲子", "高跟鞋", "襪子"]).add_yaxis("商家A", [5, 20, 36, 10, 75, 90]).add_yaxis("商家B", [15, 25, 16, 55, 48, 8]).set_global_opts(title_opts=opts.TitleOpts(title="Bar-基本示例", subtitle="我是副標(biāo)題")))return c ########################################## @app.route("/") def index():c = bar_base()return Markup(c.render_embed())if __name__ == "__main__":app.run()此時(shí)你的目錄應(yīng)該是這樣
step4
啟動(dòng)項(xiàng)目
最后一步就是啟動(dòng)項(xiàng)目,從命令行進(jìn)入pyecharts-flask-demo文件夾并執(zhí)行
python server.py使用瀏覽器打開 http://127.0.0.1:5000 即可訪問服務(wù)
此時(shí)我們就成功在Flask中使用pyecharts,不過以上操作僅將這個(gè)項(xiàng)目部署在本地,當(dāng)然在服務(wù)器中的配置與啟動(dòng)方法完全一樣。接下來(lái)我們可以利用Flask實(shí)現(xiàn)前后端分離或使用動(dòng)態(tài)更新數(shù)據(jù),增量更新數(shù)據(jù)(定時(shí)刷新的核心在于 HTML 的setInterval方法)等功能。而這些就交給大家自己探索或關(guān)注以后的文章。
在Django中使用
在Django中配置與使用比Flask稍微復(fù)雜一點(diǎn),但是也并不困難!
step1
新建一個(gè)Django項(xiàng)目
Django的安裝可以使用pip install Django
打開命令行執(zhí)行下面代碼創(chuàng)建一個(gè)Django項(xiàng)目目錄
django-admin startproject pyecharts_django_demo然后執(zhí)行下面代碼創(chuàng)建一個(gè)app
python manage.py startapp demo此時(shí)我們的目錄應(yīng)該是這樣
打開pyecharts_django_demo/settings.py修改下面部分代碼來(lái)注冊(cè)應(yīng)用程序
# pyecharts_django_demo/settings.py INSTALLED_APPS = ['django.contrib.admin','django.contrib.auth','django.contrib.contenttypes','django.contrib.sessions','django.contrib.messages','django.contrib.staticfiles','demo' # <--- ]再編輯demo/urls.py 文件(新建一個(gè)文件)
# demo/urls.py from django.conf.urls import urlfrom . import viewsurlpatterns = [url(r'^$', views.index, name='index'), ]再修改pyecharts_django_demo/urls.py
#pyecharts_django_demo/urls.py from django.conf.urls import include, url from django.contrib import adminurlpatterns = [url(r'^admin/', admin.site.urls),url(r'demo/', include('demo.urls')) # <--- ]step2
拷貝pyecharts模版
先在 demo 文件夾下新建 templates 文件夾,然后將 pyecharts 模板,位于 pyecharts.render.templates 拷貝至剛新建的 templates 文件夾。此時(shí)我們的目錄是這樣
step3
渲染圖表
將下列代碼保存到 demo/views.py 中,其中繪圖部分可以替換為你的相關(guān)代碼
from jinja2 import Environment, FileSystemLoader from pyecharts.globals import CurrentConfig from django.http import HttpResponseCurrentConfig.GLOBAL_ENV = Environment(loader=FileSystemLoader("./demo/templates"))from pyecharts import options as opts from pyecharts.charts import Bardef index(request):c = (Bar().add_xaxis(["襯衫", "羊毛衫", "雪紡衫", "褲子", "高跟鞋", "襪子"]).add_yaxis("商家A", [5, 20, 36, 10, 75, 90]).add_yaxis("商家B", [15, 25, 16, 55, 48, 8]).set_global_opts(title_opts=opts.TitleOpts(title="Bar-基本示例", subtitle="我是副標(biāo)題")))return HttpResponse(c.render_embed())step4
啟動(dòng)Django項(xiàng)目
在命令行進(jìn)入主目錄執(zhí)行即可
python manage.py runserver現(xiàn)在進(jìn)入http://127.0.0.1:8000/demo
即可訪問服務(wù)
接下來(lái)就可以結(jié)合Django實(shí)現(xiàn)前后端分離從而實(shí)現(xiàn)定時(shí)全量、增量更新圖表比如前端主動(dòng)向后端進(jìn)行數(shù)據(jù)刷新等相關(guān)功能。
總結(jié)
以上是生活随笔為你收集整理的django前后端结合_简单4步用FLASK/Django部署你的Pyecharts项目的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 浇地卷帘喷灌机掉链子怎么回事,浇地卷帘喷
- 下一篇: go操作网页元素_7天用Go动手写/从零