标签：session func sage result imp -- import tty 管理员
Django项目的配置文件APP配置
INSTALLED_APPS = [ ‘django.contrib.admin‘, # 管理员站点 ‘django.contrib.auth‘, # 认证授权系统 ‘django.contrib.contenttypes‘, # 内容类型框架 ‘django.contrib.sessions‘, # 会话框架 ‘django.contrib.messages‘, # 消息框架 ‘django.contrib.staticfiles‘, # 管理静态文件的框架 ‘myapp‘, ‘django_echarts‘, # 注册Django rest framework ‘rest_framework‘, # 在这里需要注册Django rest framework ]
Django项目的URL配置
from django.contrib import admin from django.urls import include, path urlpatterns = [ path(‘admin/‘, admin.site.urls), path(‘‘, include(‘myapp.urls‘)) ]
APP路由配置
from django.urls import path from . import views urlpatterns = [ path(‘‘, views.index, name=‘index‘), path(‘show/‘, views.ChartView.as_view(), name=‘show‘) ]
APP视图代码
from django.shortcuts import HttpResponse from django.shortcuts import render from pyecharts.charts import Bar from pyecharts import options from rest_framework.views import APIView from random import randrange import json import os def index(request): return render(request, ‘main.html‘) def response_as_json(data): json_str = json.dumps(data) response = HttpResponse( json_str, content_type=‘application/json‘ ) response[‘Access-Control-Allow-Region‘] = ‘*‘ return response def json_response(data, code=200): data = { ‘code‘: code, ‘msg‘: ‘success‘, ‘data‘: data, } return response_as_json(data) def json_error(error_string=‘error‘, code=500, **kwargs): data = { ‘code‘: code, ‘msg‘: error_string, ‘data‘: {} } data.update(kwargs) return response_as_json(data) JsonResponse = json_response JsonError = json_error def bar_base() -> Bar: bar = ( Bar() .add_xaxis(["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]) .add_yaxis(‘商家A‘, [randrange(0, 100) for _ in range(6)]) .set_global_opts(title_opts=options.TitleOpts(title=‘这是标题‘, subtitle=‘这是副标题‘)) .dump_options_with_quotes() ) return bar class ChartView(APIView): def get(self, request, *args, **kwargs): return JsonResponse(json.loads(bar_base()))
模板页实现
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/html"> <head> <meta charset="UTF-8"> {% load static %} <link rel="stylesheet" href="{% static ‘bootstrap-3.3.7-dist/css/bootstrap.min.css‘ %}" type="text/css"/> <script src="{% static ‘echarts-4.5.0/echarts.common.min.js‘ %}"></script> <script src="{% static ‘jquery/jquery.min.js‘ %}"></script> <script src="{% static ‘bootstrap-3.3.7-dist/js/bootstrap.min.js‘ %}"></script> <title>Index</title> </head> <body> <div class="container"> {% block content %} {% endblock %} </div> </body> </html>
刷新界面实现
{% extends ‘index.html‘ %}
{% block content %}
<div id="bar" style="width: 800px; height: 600px"></div>
{{ data | safe }}
<script>
var myChart = echarts.init(document.getElementById(‘bar‘), ‘white‘, {renderer: ‘cavnvas‘});
$(
function () {
fetchData();
window.setInterval(fetchData, 2000)
}
);
function fetchData() {
$.ajax({
type: ‘GET‘,
url: ‘/show/‘,
dataType: ‘json‘,
success: function (result) {
myChart.setOption(result.data)
},
error: function (result) {
console.log(result)
}
})
}
</script>
{% endblock %}
标签：session func sage result imp -- import tty 管理员
原文地址：https://www.cnblogs.com/kris-wang/p/12208193.html
