做用django一个echarts读取数据库数据的案例,一定要可以运行的
时间: 2023-05-29 13:01:09 浏览: 161
1. 创建django项目并安装echarts
```bash
django-admin startproject echarts_demo
cd echarts_demo
python3 -m venv venv
source venv/bin/activate
pip install Django
pip install echarts-python
```
2. 在项目目录下创建一个名为'app'的django应用
```bash
python manage.py startapp app
```
3. 修改settings.py配置文件，把'app'应用添加到INSTALLED_APPS中
```python
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'app',
]
```
4. 在'app'应用下创建一个urls.py文件，并添加路由
```python
from django.urls import path
from .views import index, echarts_view
urlpatterns = [
path('', index, name='index'),
path('echarts', echarts_view, name='echarts'),
]
```
5. 在'app'应用下创建一个views.py文件，并添加index和echarts_view方法
```python
from django.shortcuts import render
from echarts import Echart, Legend, Pie
def index(request):
return render(request, 'index.html')
def echarts_view(request):
c = (
Pie()
.add("", [list(z) for z in db_data.items()])
.set_global_opts(title_opts=opts.TitleOpts(title="数据库中数据统计"))
)
return HttpResponse(c.render_embed(), content_type="text/html")
```
6. 在'app'应用下创建一个templates文件夹，再创建一个index.html文件，编写页面代码
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Django ECharts Demo</title>
<script src="https://cdn.jsdelivr.net/npm/echarts@4.7.0/dist/echarts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/echarts-gl@1.1.1/dist/echarts-gl.min.js"></script>
</head>
<body>
<h1>Django ECharts Demo</h1>
<div id="chart" style="height: 500px;width: 100%;"></div>
<script>
var myChart = echarts.init(document.getElementById('chart'));
myChart.showLoading();
myChart.hideLoading({});
myChart.setOption({
title: {
text: '数据库中数据统计',
left: 'center'
},
tooltip: {},
series: [{
name: '数量',
type: 'pie',
radius: '55%',
data: []
}]
});
</script>
<a href="{% url 'echarts' %}">跳转到ECharts页面</a>
</body>
</html>
```
7. 在views.py中添加获取数据库数据的代码
```python
import pymysql
from django.conf import settings
from django.http import HttpResponse
from django.shortcuts import render
from echarts import Echart, Legend, Pie
def index(request):
context = {}
try:
conn = pymysql.connect(
host=settings.DATABASES['default']['HOST'],
user=settings.DATABASES['default']['USER'],
password=settings.DATABASES['default']['PASSWORD'],
database=settings.DATABASES['default']['NAME']
)
cursor = conn.cursor()
cursor.execute("SELECT COUNT(*) FROM test")
count = cursor.fetchone()[0]
db_data = {'数据总量': count}
conn.close()
except Exception as e:
db_data = {'error': str(e)}
context['db_data'] = db_data
return render(request, 'index.html', context)
def echarts_view(request):
context = {}
try:
conn = pymysql.connect(
host=settings.DATABASES['default']['HOST'],
user=settings.DATABASES['default']['USER'],
password=settings.DATABASES['default']['PASSWORD'],
database=settings.DATABASES['default']['NAME']
)
cursor = conn.cursor()
cursor.execute("SELECT COUNT(*) FROM test")
count = cursor.fetchone()[0]
db_data = {'数据总量': count}
conn.close()
except Exception as e:
db_data = {'error': str(e)}
c = (
Pie()
.add("", [list(z) for z in db_data.items()])
.set_global_opts(title_opts=opts.TitleOpts(title="数据库中数据统计"))
)
context['echarts_data'] = c.render_embed()
return render(request, 'echarts.html', context)
```
8. 修改app下的urls.py文件，绑定echarts_view到地址'/echarts'
```python
from django.urls import path
from .views import index, echarts_view
urlpatterns = [
path('', index, name='index'),
path('echarts', echarts_view, name='echarts'),
]
```
9. 在templates文件夹下创建一个名为'echarts.html'的模板文件，编写页面代码
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Django ECharts Demo</title>
<script src="https://cdn.jsdelivr.net/npm/echarts@4.7.0/dist/echarts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/echarts-gl@1.1.1/dist/echarts-gl.min.js"></script>
</head>
<body>
<h1>Django ECharts Demo</h1>
<div id="chart" style="height: 500px;width: 100%;"></div>
{{ echarts_data|safe }}
<a href="{% url 'index' %}">回到首页</a>
</body>
</html>
```
10. 运行django服务器
```bash
python manage.py runserver
```
11. 在浏览器中访问'http://localhost:8000'即可看到展示页面
12. 在浏览器中访问'http://localhost:8000/echarts'即可看到echarts页面展示
注意：因为我无法访问您的数据库，所以数据库数据是 'test' 表的数量，而不是您所使用的真实数据。您需要根据自己的数据库架构来修改代码，在网上搜索'python连接数据库'即可找到相关教程。
相关推荐
最新推荐
Django读取Mysql数据并显示在前端的实例
今天小编就为大家分享一篇Django读取Mysql数据并显示在前端的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
Django+Echarts画图实例详解
主要介绍了Django+Echarts画图实例详解，可以了解Django中aggregate和annotate函数的使用方法及其Django+Echarts绘制柱状图的完整示例，感兴趣的小伙伴们可以参考一下
Django使用Mysql数据库已经存在的数据表方法
今天小编就为大家分享一篇Django使用Mysql数据库已经存在的数据表方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
图文详解Django使用Pycharm连接MySQL数据库
主要介绍了Django使用Pycharm连接MySQL数据库的实现,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
django执行数据库查询之后实现返回的结果集转json
主要介绍了django执行数据库查询之后实现返回的结果集转json，希望对大家有所帮助。一起跟随小编过来看看吧
zigbee-cluster-library-specification
最新的zigbee-cluster-library-specification说明文档。
管理建模和仿真的文件
管理Boualem Benatallah引用此版本：布阿利姆·贝纳塔拉。管理建模和仿真。约瑟夫-傅立叶大学-格勒诺布尔第一大学，1996年。法语。NNT：电话：00345357HAL ID：电话：00345357https://theses.hal.science/tel-003453572008年12月9日提交HAL是一个多学科的开放存取档案馆，用于存放和传播科学研究论文，无论它们是否被公开。论文可以来自法国或国外的教学和研究机构，也可以来自公共或私人研究中心。L’archive ouverte pluridisciplinaire
实现实时数据湖架构：Kafka与Hive集成
# 1. 实时数据湖架构概述**
实时数据湖是一种现代数据管理架构，它允许企业以低延迟的方式收集、存储和处理大量数据。与传统数据仓库不同，实时数据湖不依赖于预先定义的模式，而是采用灵活的架构，可以处理各种数据类型和格式。这种架构为企业提供了以下优势：
- **实时洞察：**实时数据湖允许企业访问最新的数据，从而做出更明智的决策。
- **数据民主化：**实时数据湖使各种利益相关者都可
2． 通过python绘制y=e-xsin(2πx)图像
可以使用matplotlib库来绘制这个函数的图像。以下是一段示例代码：
```python
import numpy as np
import matplotlib.pyplot as plt
def func(x):
return np.exp(-x) * np.sin(2 * np.pi * x)
x = np.linspace(0, 5, 500)
y = func(x)
plt.plot(x, y)
plt.xlabel('x')
plt.ylabel('y')
plt.title('y = e^{-x} sin(2πx)')
plt.show()
```
运行这段
JSBSim Reference Manual
JSBSim参考手册，其中包含JSBSim简介，JSBSim配置文件xml的编写语法，编程手册以及一些应用实例等。其中有部分内容还没有写完，估计有生之年很难看到完整版了，但是内容还是很有参考价值的。