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 相关文章推荐
Python更新数据库脚本两种方法及对比介绍
Jul 27 Python
Python3.6安装及引入Requests库的实现方法
Jan 24 Python
TensorFlow搭建神经网络最佳实践
Mar 09 Python
python学习笔记--将python源文件打包成exe文件(pyinstaller)
May 26 Python
Atom的python插件和常用插件说明
Jul 08 Python
flask框架使用orm连接数据库的方法示例
Jul 16 Python
python同时遍历数组的索引和值的实例
Nov 15 Python
python使用requests模块实现爬取电影天堂最新电影信息
Apr 03 Python
Python绘制股票移动均线的实例
Aug 24 Python
Python SELENIUM上传文件或图片实现过程
Oct 28 Python
Python基于gevent实现高并发代码实例
May 15 Python
Django实现随机图形验证码的示例
Oct 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
PHP XML备份Mysql数据库
2009/05/27 PHP
php魔术方法与魔术变量、内置方法与内置变量的深入分析
2013/06/03 PHP
Fatal error: session_start(): Failed to initialize storage module: files问题解决方法
2014/05/04 PHP
Yii控制器中filter过滤器用法分析
2016/07/15 PHP
PHP数组内存利用率低和弱类型详细解读
2017/08/10 PHP
关于JAVASCRIPT urldecode URL解码的问题
2012/01/08 Javascript
NodeJS的模块写法入门(实例代码)
2012/03/07 NodeJs
JS格式化数字保留两位小数点示例代码
2013/10/15 Javascript
jquery用offset()方法获得元素的xy坐标
2014/09/06 Javascript
简单的分页代码js实现
2016/05/17 Javascript
jQuery中借助deferred来请求及判断AJAX加载的实例讲解
2016/05/24 Javascript
简单实现的JQuery文本框水印插件
2016/06/14 Javascript
全面解析JavaScript中“&&”和“||”操作符(总结篇)
2016/07/18 Javascript
JS实现HTML标签转义及反转义
2020/04/14 Javascript
JavaScript实现简单的星星评分效果
2017/05/18 Javascript
利用nginx + node在阿里云部署https的步骤详解
2017/12/19 Javascript
nodejs 最新版安装npm 的使用详解
2018/01/18 NodeJs
Vue实现active点击切换方法
2018/03/16 Javascript
迅速了解一下ES10中Object.fromEntries的用法使用
2019/03/05 Javascript
浅谈JS中this在各个场景下的指向
2019/08/14 Javascript
JS+CSS实现随机点名(实例代码)
2019/11/04 Javascript
从Node.js事件触发器到Vue自定义事件的深入讲解
2020/06/26 Javascript
仿照Element-ui实现一个简易的$message方法
2020/09/14 Javascript
nodejs中内置模块fs,path常见的用法说明
2020/11/07 NodeJs
[01:15:12]DOTA2上海特级锦标赛主赛事日 - 1 败者组第一轮#4Newbee VS CDEC
2016/03/03 DOTA
python在windows和linux下获得本机本地ip地址方法小结
2015/03/20 Python
python导出chrome书签到markdown文件的实例代码
2017/12/27 Python
python实现数据库跨服务器迁移
2018/04/12 Python
python实现图片插入文字
2019/11/26 Python
Python3.9.1中使用match方法详解
2021/02/08 Python
学校就业推荐信范文
2014/05/19 职场文书
2015年保卫科工作总结
2015/05/14 职场文书
天鹅湖观后感
2015/06/09 职场文书
小学班级管理心得体会
2016/01/07 职场文书
2019让人心动的商业计划书
2019/06/27 职场文书
MySQL中的引号和反引号的区别与用法详解
2021/10/24 MySQL