django echarts饼图数据动态加载的实例

yipeiwu_com5年前Python基础

如下所示:

后台关键代码:

data = {}
#keys与values分别为该数据的键数组,值的数组。这里循环为字典添加对应键值
for k, v in zip(keys, values):
  data.update({k: v, },)
#最后将数据打包成json格式以字典的方式传送到前端
return render(request, 'index.html', {'data': json.dumps(data)})

网页(js中)取值关键代码:

1.取值:

var kv = new Array();//声明一个新的字典
kv = {{ data|safe }};//取出后台传递的数据,此处添加safe过滤避免警告
var test = new Array();//声明一个新的字典用于存放数据
for (var logKey in kv) {
//将对应键值对取出存入test,logKey 为该字典的键
  test.push({value: kv[logKey], name: logKey});
}

2.饼图赋值:

var option = {
  title: {
  show:true,
  fontSize : 15,
  text: '数据测试'
    },
  series: [{
    type: 'pie',
    radius: '55%',
    data:test,//赋值方式为字典传值
  }]
 }

效果图:

以上这篇django echarts饼图数据动态加载的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持【听图阁-专注于Python设计】。

相关文章

浅谈python字典多键值及重复键值的使用

浅谈python字典多键值及重复键值的使用

在python中使用字典,格式如下: dict={ key1:value1 , key2;value2 ...} 在实际访问字典值时的使用格式如下: dict[key] 多键值 字典的...

Django中的FBV和CBV用法详解

Django中的FBV和CBV用法详解

FBV FBV,即 func base views,函数视图,在视图里使用函数处理请求。 以用户注册代码为例, 使用两个函数完成注册 初级注册代码 def register(req...

Pytorch 神经网络—自定义数据集上实现教程

Pytorch 神经网络—自定义数据集上实现教程

第一步、导入需要的包 import os import scipy.io as sio import numpy as np import torch import torch.nn...

numpy中实现二维数组按照某列、某行排序的方法

如何根据二维数组中的某一行或者某一列排序?假设data是一个numpy.array类型的二维数组,可以利用numpy中的argsort函数进行实现,代码实例如下: data = da...

python win32 简单操作方法

源由 刚开始是帮朋友做一个按键精灵操作旺信的脚本,写完后各种不稳定;后来看到python可以操作win32相关的api,恰好这一段时间正在学习python,感觉练手的时候到了~~~ 下载...