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


Posted in Python onAugust 12, 2019

如下所示:

后台关键代码:

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饼图数据动态加载的实例

以上这篇django echarts饼图数据动态加载的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Python 相关文章推荐
浅谈function(函数)中的动态参数
Apr 30 Python
Python3.5 创建文件的简单实例
Apr 26 Python
python库lxml在linux和WIN系统下的安装
Jun 24 Python
解决Python pandas df 写入excel 出现的问题
Jul 04 Python
python实现本地图片转存并重命名的示例代码
Oct 27 Python
python使用socket实现的传输demo示例【基于TCP协议】
Sep 24 Python
Python中Flask-RESTful编写API接口(小白入门)
Dec 11 Python
Python无头爬虫下载文件的实现
Apr 02 Python
python按照list中字典的某key去重的示例代码
Oct 13 Python
windows系统Tensorflow2.x简单安装记录(图文)
Jan 18 Python
详解修改Anaconda中的Jupyter Notebook默认工作路径的三种方式
Jan 24 Python
python读取mat文件生成h5文件的实现
Jul 15 Python
python scrapy爬虫代码及填坑
Aug 12 #Python
Python 中的 global 标识对变量作用域的影响
Aug 12 #Python
Python中pymysql 模块的使用详解
Aug 12 #Python
python中类的输出或类的实例输出为这种形式的原因
Aug 12 #Python
对Django 中request.get和request.post的区别详解
Aug 12 #Python
python文字和unicode/ascll相互转换函数及简单加密解密实现代码
Aug 12 #Python
Python简易版停车管理系统
Aug 12 #Python
You might like
神族 Protoss 剧情介绍
2020/03/14 星际争霸
一个简单的PHP入门源程序
2006/10/09 PHP
php查看session内容的函数
2008/08/27 PHP
php 论坛采集程序 模拟登陆,抓取页面 实现代码
2009/07/09 PHP
php中批量删除Mysql中相同前缀的数据表的代码
2011/07/01 PHP
ThinkPHP开发框架函数详解:C方法
2015/08/14 PHP
php实现微信公众号无限群发
2015/10/11 PHP
PHP实现通过URL提取根域名
2016/03/31 PHP
php解决和避免form表单重复提交的几种方法
2016/08/31 PHP
完美解决thinkphp唯一索引重复时出错的问题
2017/03/31 PHP
php实现和c#一致的DES加密解密实例
2017/07/24 PHP
javascript 字符 Escape,encodeURI,encodeURIComponent
2009/07/09 Javascript
jquery内置验证(validate)使用方法示例(表单验证)
2013/12/04 Javascript
按下Enter焦点移至下一个控件的实现js代码
2013/12/11 Javascript
js 实现的可折叠留言板(附源码下载)
2014/07/01 Javascript
jQuery+Ajax实现无刷新操作
2016/01/04 Javascript
JavaScript数组去重的几种方法效率测试
2016/10/23 Javascript
详解Vue结合后台的列表增删改案例
2018/08/21 Javascript
js String.prototype.trim字符去前后空格的扩展
2020/08/23 Javascript
微信小程序拖拽排序列表的示例代码
2020/07/08 Javascript
[04:11]2014DOTA2国际邀请赛 CIS遗憾出局梦想不灭
2014/07/09 DOTA
[02:54]辉夜杯主赛事第二日败者组 iG.V赛后采访
2015/12/26 DOTA
Python中Class类用法实例分析
2015/11/12 Python
Python对list列表结构中的值进行去重的方法总结
2016/05/07 Python
Python日期的加减等操作的示例
2017/08/15 Python
numpy.transpose对三维数组的转置方法
2018/04/17 Python
python遍历一个目录,输出所有的文件名的实例
2018/04/23 Python
TensorFlow Session使用的两种方法小结
2018/07/30 Python
Python基于gevent实现高并发代码实例
2020/05/15 Python
美国电子产品主要品牌的授权在线零售商:DataVision
2019/03/23 全球购物
新闻传媒系求职信范文
2014/04/19 职场文书
春季防火方案
2014/05/10 职场文书
会计系毕业生求职信
2014/05/28 职场文书
Python中glob库实现文件名的匹配
2021/06/18 Python
十大经典日本动漫排行榜 海贼王第三,犬夜叉仅第八
2022/03/18 日漫
Python OpenCV超详细讲解基本功能
2022/04/02 Python