如何使用Django MySQL Dashboard实现网页端数据库可视化功能?

2026-06-11 05:471阅读0评论SEO资源
  • 内容介绍
  • 文章标签
  • 相关推荐

本文共计1014个文字,预计阅读时间需要5分钟。

如何使用Django MySQL Dashboard实现网页端数据库可视化功能?

1. 概述Python、MySQL、Django,拥有部分数据托管在MySQL数据库中,期望通过web方式进行可视化,对数据库信息进行展示/检索/维护等操作。本项目中的数据托管在MySQL数据库中。

1. Overview

Python+MySQL+Django, 有些数据托管在 MySQL 的数据库,然后我们希望进行可视化,通过 web 的方式对数据库的信息去进行展示/检索/维护/..

这个项目中,我们的数据托管在 MySQL 的数据库中,然后在 Django 中配置数据库信息,连接到数据库,在前端用 Django-table2 进行渲染;

最终我们可以在 web 端看到如下所示效果,可以进行展示所有的数据,然后进行检索和过滤;

2. 流程

想要在 Django 中访问 MySQL 数据库的数据,首先要在 Django 的 setting.py 里面规定好数据库的 ‘Name‘ / ‘USER‘ / ‘PASSWORD‘

需要对于对象 news 或者别的实体,创建 model, 下图中的 step4;

利用 Django-tables2 进行渲染,具体 Django-tables2 的使用可以参考django-tables2.readthedocs.io/en/latest/pages/tutorial.html;

过滤/搜索/排序 都可以在后端,变成对 query 的操作,如 step6 ;

如何使用Django MySQL Dashboard实现网页端数据库可视化功能?

3. 源码

代码托管在 github, 在 Ubuntu host:

git clone github.com/coneypo/Django_MySQL_Table

index.html

{% load render_table from django_tables2 %} {% load querystring from django_tables2 %} {% load bootstrap3 %} <!doctype html> <html> <head> <a href="board/"><title>Django table example</title></a> <link rel="stylesheet" href="/static/css/pos.css"/> <link rel="stylesheet" href="/static/css/bootstrap.min.css"/> <link rel="stylesheet" href="/static/css/table_1.css"/> <style> body {background-color: whitesmoke;} </style> <script type="text/javascript" src="/static/js/jquery-1.11.0.js"></script> </head> <body> <div id="Top" style="background:#38c"> <a href="/table_example" id="acrn_title">&nbsp;Django-MySQL example -- coneypo</a> </div> <div id="Center"> <div id="Center_Searcher"> <form action="/news_search" method="get"> <table class="center_table"> <tr><td colspan="5"><h3>Search by Title</h3></td></tr> <tr> <td>Keyword:</td> <td align="center">&nbsp;&nbsp;<input name="keywd_input" value="{{ keywd_input }}"></td> <td align="center">&nbsp;&nbsp;<input type="submit" value="search"></td> </tr> </table> </form> </div> <div id="Center_Filter"> <form action="/news_filter" method="get"> <table class="center_table"> <tr><td colspan="5"><h3>Filter</h3></td></tr> <tr> <td>Category:</td> <td>&nbsp;&nbsp;<select name="filter_category"> {% for i in category_list %} <option value="{{i}}" {% if i == filter_category %} selected{% endif %}>{{i}}</option> {% endfor %} </select></td> <td><input type="submit" value="Filter"></td> </tr> </table> </form> </div> </div> <div id="Table"> <h3>&nbsp;Device table</h3> <form action="/download_excel" method="get"> &nbsp;&nbsp;<a href="/download_excel">Download to excel</a> </form><br> {% render_table table %} </div> </div> </body> </html>

views.py

1 from django.shortcuts import render 2 from django.db import models 3 from django.127.0.0.1:8000/table_example

或者

python3 manage.py runserver 0.0.0.0:port # 比如
python3 manage.py runserver 0.0.0.0:8777

打开本地网站[本机IP]:[port]/table_example, 同一路由下也可以访问到该网站;

所以可以用来搭建 lab 内设备管理系统/ 人员登记 / KPI 展示 前端 web 网页;

# 请尊重他人劳动成果,转载或者使用源码请注明出处:www.cnblogs.com/AdaminXie

#如果对您有帮助,欢迎在 GitHub 上 Star 支持下:github.com/coneypo/Django_MySQL_Table

# 如有问题请留言或者联系邮箱[emailprotected],商业合作勿扰

本文共计1014个文字,预计阅读时间需要5分钟。

如何使用Django MySQL Dashboard实现网页端数据库可视化功能?

1. 概述Python、MySQL、Django,拥有部分数据托管在MySQL数据库中,期望通过web方式进行可视化,对数据库信息进行展示/检索/维护等操作。本项目中的数据托管在MySQL数据库中。

1. Overview

Python+MySQL+Django, 有些数据托管在 MySQL 的数据库,然后我们希望进行可视化,通过 web 的方式对数据库的信息去进行展示/检索/维护/..

这个项目中,我们的数据托管在 MySQL 的数据库中,然后在 Django 中配置数据库信息,连接到数据库,在前端用 Django-table2 进行渲染;

最终我们可以在 web 端看到如下所示效果,可以进行展示所有的数据,然后进行检索和过滤;

2. 流程

想要在 Django 中访问 MySQL 数据库的数据,首先要在 Django 的 setting.py 里面规定好数据库的 ‘Name‘ / ‘USER‘ / ‘PASSWORD‘

需要对于对象 news 或者别的实体,创建 model, 下图中的 step4;

利用 Django-tables2 进行渲染,具体 Django-tables2 的使用可以参考django-tables2.readthedocs.io/en/latest/pages/tutorial.html;

过滤/搜索/排序 都可以在后端,变成对 query 的操作,如 step6 ;

如何使用Django MySQL Dashboard实现网页端数据库可视化功能?

3. 源码

代码托管在 github, 在 Ubuntu host:

git clone github.com/coneypo/Django_MySQL_Table

index.html

{% load render_table from django_tables2 %} {% load querystring from django_tables2 %} {% load bootstrap3 %} <!doctype html> <html> <head> <a href="board/"><title>Django table example</title></a> <link rel="stylesheet" href="/static/css/pos.css"/> <link rel="stylesheet" href="/static/css/bootstrap.min.css"/> <link rel="stylesheet" href="/static/css/table_1.css"/> <style> body {background-color: whitesmoke;} </style> <script type="text/javascript" src="/static/js/jquery-1.11.0.js"></script> </head> <body> <div id="Top" style="background:#38c"> <a href="/table_example" id="acrn_title">&nbsp;Django-MySQL example -- coneypo</a> </div> <div id="Center"> <div id="Center_Searcher"> <form action="/news_search" method="get"> <table class="center_table"> <tr><td colspan="5"><h3>Search by Title</h3></td></tr> <tr> <td>Keyword:</td> <td align="center">&nbsp;&nbsp;<input name="keywd_input" value="{{ keywd_input }}"></td> <td align="center">&nbsp;&nbsp;<input type="submit" value="search"></td> </tr> </table> </form> </div> <div id="Center_Filter"> <form action="/news_filter" method="get"> <table class="center_table"> <tr><td colspan="5"><h3>Filter</h3></td></tr> <tr> <td>Category:</td> <td>&nbsp;&nbsp;<select name="filter_category"> {% for i in category_list %} <option value="{{i}}" {% if i == filter_category %} selected{% endif %}>{{i}}</option> {% endfor %} </select></td> <td><input type="submit" value="Filter"></td> </tr> </table> </form> </div> </div> <div id="Table"> <h3>&nbsp;Device table</h3> <form action="/download_excel" method="get"> &nbsp;&nbsp;<a href="/download_excel">Download to excel</a> </form><br> {% render_table table %} </div> </div> </body> </html>

views.py

1 from django.shortcuts import render 2 from django.db import models 3 from django.127.0.0.1:8000/table_example

或者

python3 manage.py runserver 0.0.0.0:port # 比如
python3 manage.py runserver 0.0.0.0:8777

打开本地网站[本机IP]:[port]/table_example, 同一路由下也可以访问到该网站;

所以可以用来搭建 lab 内设备管理系统/ 人员登记 / KPI 展示 前端 web 网页;

# 请尊重他人劳动成果,转载或者使用源码请注明出处:www.cnblogs.com/AdaminXie

#如果对您有帮助,欢迎在 GitHub 上 Star 支持下:github.com/coneypo/Django_MySQL_Table

# 如有问题请留言或者联系邮箱[emailprotected],商业合作勿扰