簡單4步用FLASK/Django部署你的Pyecharts項目

前言

為什么將pyecharts與web框架結合使用？因為如果只是單純的使用pyecharts，我們展示的時候只能將我們的圖表生成為靜態文件，雖然也在也可以使用iframe等語句嵌入前端頁面但是並不方便前后端數據交互。

如果我們在Flask/Django/Tornado/Sanic中使用pyecharts就結合通過這些web框架來實現前后端分離或使用動態更新數據，增量更新數據(比如前端主動向后端進行數據刷新等)等功能。進一步可以購買一個服務器去將項目部署在服務器上，這樣就能隨時隨地展示你的數據分析可視化結果，而這一切並不困難。例如我們之前做過疫情可視化網站就是Django+pyecharts實現👇

 

本文主要介紹如何在本地結合Flask/Django使用pyecharts。

在Flask中使用

step1

新建一個flask項目

Flask的安裝可以使用pip install flask首先我們建立一個文件夾pyecharts-flask-demo然后進入這個這個文件夾中再建一個新的文件夾templates這樣我們就為我們接下來的flask項目創建了一個目錄。

step2

拷貝pyecharts模版

將 pyecharts 模板，位於官方GitHub中的 pyecharts.render.templates 全部文件拷貝至剛新建的 templates 文件夾。

 

step3

渲染模版

在這一步我們只要在文件夾pyecharts-flask-demo也就是主目錄下創建創建一個python腳本命名為server.py並填入以下代碼，當然中間的繪圖部分代碼可以替換為自己的繪圖部分代碼

from flask import Flask
from jinja2 import Markup, Environment, FileSystemLoader
from pyecharts.globals import CurrentConfig

# 關於 CurrentConfig，可參考 [基本使用-全局變量]
CurrentConfig.GLOBAL_ENV = Environment(loader=FileSystemLoader("./templates"))

from pyecharts import options as opts
from pyecharts.charts import Bar

app = 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="我是副標題"))
    )
    return c
##########################################
@app.route("/")
def index():
    c = bar_base()
    return Markup(c.render_embed())


if __name__ == "__main__":
    app.run()

此時你的目錄應該是這樣

step4

啟動項目

最后一步就是啟動項目，從命令行進入pyecharts-flask-demo文件夾並執行

python server.py

使用瀏覽器打開 http://127.0.0.1:5000 即可訪問服務

此時我們就成功在Flask中使用pyecharts，不過以上操作僅將這個項目部署在本地，當然在服務器中的配置與啟動方法完全一樣。接下來我們可以利用Flask實現前后端分離或使用動態更新數據，增量更新數據(定時刷新的核心在於 HTML 的setInterval方法)等功能。而這些就交給大家自己探索或關注以后的文章。

在Django中使用

在Django中配置與使用比Flask稍微復雜一點，但是也並不困難！

step1

新建一個Django項目

Django的安裝可以使用pip install Django

打開命令行執行下面代碼創建一個Django項目目錄

django-admin startproject pyecharts_django_demo

然后執行下面代碼創建一個app

python manage.py startapp demo

此時我們的目錄應該是這樣

打開pyecharts_django_demo/settings.py修改下面部分代碼來注冊應用程序

# 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 文件(新建一個文件)

# demo/urls.py
from django.conf.urls import url

from . import views

urlpatterns = [
    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 admin

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'demo/', include('demo.urls')) # <---
]

step2

拷貝pyecharts模版

先在 demo 文件夾下新建 templates 文件夾，然后將 pyecharts 模板，位於 pyecharts.render.templates 拷貝至剛新建的 templates 文件夾。此時我們的目錄是這樣

step3

渲染圖表

將下列代碼保存到 demo/views.py 中，其中繪圖部分可以替換為你的相關代碼

from jinja2 import Environment, FileSystemLoader
from pyecharts.globals import CurrentConfig
from django.http import HttpResponse

CurrentConfig.GLOBAL_ENV = Environment(loader=FileSystemLoader("./demo/templates"))

from pyecharts import options as opts
from pyecharts.charts import Bar


def 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="我是副標題"))
    )
    return HttpResponse(c.render_embed())

step4

啟動Django項目

在命令行進入主目錄執行即可

python manage.py runserver

現在進入http://127.0.0.1:8000/demo

即可訪問服務

 

接下來就可以結合Django實現前后端分離從而實現定時全量、增量更新圖表比如前端主動向后端進行數據刷新等相關功能。