python项目篇-从数据库获取数据以Json格式返回前端数据可视化方式显示

python项目篇-从数据库获取数据以Json格式返回前端数据可视化方式显示_第1张图片
views.py:
def adminEchartIncome(request):

    ret = models.incomeAccount.objects.all().order_by("dayIncome","id")
    # ret = serialize("json",ret)
    # print(ret)

    json_list = []

    for i in ret:
        json_dict = {}
        json_dict["id"] = i.id
        json_dict["totalIncome"] = i.totalIncome
        json_dict["dayIncome"] = i.dayIncome
        json_dict["remarkIncome"] = i.remarkIncome
        json_dict["totalBath"] = i.totalBath
        json_dict["totalBathHouse"] = i.totalBathHouse
        json_dict["totalHouse"] = i.totalHouse
        json_dict["totalPay"] = i.totalPay

        json_list.append(json_dict)

    ret1 = json.dumps(json_list)
    print(ret1,type(ret1))
    return render(request,'admin_chartIncome.html',{"ret": json.dumps(ret1)})

html:

{# 继承模板 #}
{% extends 'admin_base.html' %}
{% load static %}

{#把这个页面塞到模版#}
{% block page-main %}
    

清泉后台管理页面--收入可视化

收入可视化
{# #} {# #}
{# 新页面添加#} {# #}
{% endblock %} {% block class_chartIncome %} active {% endblock %}

总结:第一次直接用取数据库的数据格式报错,这在我的bug记录中有说明
其次使用以下代码:

def getdata(request):
   # 使用ORM
   # all()返回的是QuerySet 数据类型;values()返回的是ValuesQuerySet 数据类型
    ret = models.incomeAccount.objects.all().order_by("dayIncome","id")
 	ret = serialize("json",ret)
	print(ret)
	return render(request,'admin_chartIncome.html',{"ret": json.dumps(ret)})

ret返回的数据是:

[{"model": "qqsys.incomeaccount", "pk": 13, "fields": {"dayIncome": "2018-12-27", "totalBath": 108, "totalHouse": 0, "totalBathHouse": 108, "totalPay": 100, "totalIncome": 8, "remarkIncome": ""}}, {"model": "qqsys.incomeaccount", "pk": 12, "fields": {"dayIncome": "2018-12-28", "totalBath": 497, "totalHouse": 200, "totalBathHouse": 697, "totalPay": 0, "totalIncome": 697, "remarkIncome": ""}}, {"model": "qqsys.incomeaccount", "pk": 11, "fields": {"dayIncome": "2018-12-29", "totalBath": 342, "totalHouse": 0, "totalBathHouse": 342, "totalPay": 590, "totalIncome": -248, "remarkIncome": ""}}, {"model": "qqsys.incomeaccount", "pk": 10, "fields": {"dayIncome": "2018-12-30", "totalBath": 955, "totalHouse": 340, "totalBathHouse": 1295, "totalPay": 709, "totalIncome": 586, "remarkIncome": ""}}, {"model": "qqsys.incomeaccount", "pk": 3, "fields": {"dayIncome": "2018-12-31", "totalBath": 764, "totalHouse": 150, "totalBathHouse": 914, "totalPay": 369, "totalIncome": 545, "remarkIncome": ""}}, {"model": "qqsys.incomeaccount", "pk": 9, "fields": {"dayIncome": "2019-01-01", "totalBath": 846, "totalHouse": 229, "totalBathHouse": 1075, "totalPay": 1035, "totalIncome": 40, "remarkIncome": ""}}, {"model": "qqsys.incomeaccount", "pk": 8, "fields": {"dayIncome": "2019-01-02", "totalBath": 372, "totalHouse": 270, "totalBathHouse": 642, "totalPay": 3708, "totalIncome": -3066, "remarkIncome": ""}}, {"model": "qqsys.incomeaccount", "pk": 16, "fields": {"dayIncome": "2019-01-03", "totalBath": 466, "totalHouse": 349, "totalBathHouse": 815, "totalPay": 340, "totalIncome": 475, "remarkIncome": ""}}] 

但是这种json不是我们想要的取不出想要的数据
所以最好使用我开头写的方式
更新**********
python项目篇-从数据库获取数据以Json格式返回前端数据可视化方式显示_第2张图片
python项目篇-从数据库获取数据以Json格式返回前端数据可视化方式显示_第3张图片

{# 继承模板 #}
{% extends 'admin_base.html' %}
{% load static %}

{#把这个页面塞到模版#}
{% block page-main %}
    

清泉后台管理页面--收入可视化

收入可视化
{# #} {# #}
{# 新页面添加#} {# #}
{% endblock %} {% block class_chartIncome %} active {% endblock %}

你可能感兴趣的:(Python,Django,项目,数据可视化)