django 使用可視化包-Pyechart

時間 2019-12-08

原文原文鏈接

Echarts 是百度開源的一個數據可視化 JS 庫，主要用於數據可視化。pyecharts 是一個用於生成 Echarts 圖表的類庫。實際上就是 Echarts 與 Python 的對接。javascript

本次使用django2.0 和 pyecharts0.3.3html

1. setttins.py 添加本身建立的app名稱，和靜態文件的路徑java

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'my_report',
]

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.oracle',
        'NAME': 'devdb',
        'USER': 'hysh',
        'PASSWORD': 'hysh',
        'HOST': '192.168.191.3',
        'PORT': '1521',
    }
}

STATIC_URL = '/static/'
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
)

2.urls.pypython

from django.contrib import admin
from django.urls import path
from month_report import views

urlpatterns = [
    path('admin/', admin.site.urls),
    path('guo/', views.guo_report, name='index'),
]

3.views.pysql

from django.shortcuts import render
from django.db import connection
from django.http import HttpResponse
from django.template import loader
from pyecharts import Bar, Geo


def exc_sql(sql):
    cursor = connection.cursor()
    cursor.execute(sql)
    result = cursor.fetchall()
    return result



def guo_report(request):
    # select    province, difi_re_num    from REPORT_REG
    ret = """select city, difi_re_num  from REPORT_REG a, province_to_city b where a.province=b.province"""
    data_list = exc_sql(ret)
    attr = [i[0] for i in data_list]
    value = [i[1] for i in data_list]
    geo = Geo("全國各地用戶註冊圖", width=1200, height=600)
    geo.add("各省註冊量", attr, value, type="effectScatter", border_color="#ffffff", symbol_size=2,
            is_label_show=True, label_text_color="#00FF00", label_pos="inside", symbol_color="yellow",
            geo_normal_color="#006edd", geo_emphasis_color="#0000ff")
    data = {'data': geo.render_embed()}
    return render(request, 'guo_report.html', data)

4.guo_report.htmldjango

<!-- myfirstvis/templates/myfirstvis/pyecharts.html -->
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>MY-ECharts</title>
    <script src="http://oog4yfyu0.bkt.clouddn.com/echarts.min.js"></script>
    <script src="http://oog4yfyu0.bkt.clouddn.com/echarts-gl.js"></script>
    <script type="text/javascript " src="http://echarts.baidu.com/gallery/vendors/echarts/map/js/china.js"></script>
    <script type="text/javascript " src="http://echarts.baidu.com/gallery/vendors/echarts/map/js/world.js"></script>
    <script type="text/javascript " src="http://oog4yfyu0.bkt.clouddn.com/wordcloud.js"></script>
</head>

<body>
  {{data|safe}}
</body>

</html>

效果圖：session