Echarts动态加载后台数据
注意:1、用Ajax请求获取后台数据 2、Echarts只能处理Json数据
后台Controller:根据业务需求不同而返回不同数据,我前台要循环遍历Echarts的series进行数据添加,所以后台返了个二维数组过去。

前端JSP页面:为Echarts准备一个具有高宽的dom容器

前端JS:初始化时即加载Echarts,将不需要进行加载的配置项(例如title、tooltip等)不作改动,将需要动态加载数据的配置放入ajax的success:function(){}中进行处理。

定义一个为series这个即将动态加入数据的配置项准备的名为Item的数组容器,
接着对后台返回过来的数据(childkind)进行遍历,将遍历出的数据赋给容器中的相应属性(例:tp.name=childkind[i])。由于series里面的data属性(接收的是数组数据)也需要进行数据动态加载,接着再定义一个list数组,循环写入数据到list中,再将list数组返给tp.data。
最后再设置Echarst相关配置项。

Echarts动态加载后台数据的更多相关文章
- AJAX 动态加载后台数据 绑定select
<select id="select"> <!--下拉框数据动态加载--> </select> js:(使用jquery) $(document ...
- easyui复选框树动态加载后台数据,实现自动选中数据库中数据。后台语言是.NET
最近公司做项目用到了easyui复选框树来实现加载不同类型产品.因为我刚刚毕业,现在也算是实习吧,所以一脸懵逼啊.在公司里的一个哥的帮助下 ,我写出来这个EasyUi复选框树了,虽然东西不难,但也是自 ...
- Echarts使用及动态加载图表数据
Echarts使用及动态加载图表数据 官网:http://echarts.baidu.com/ 1.文档 2.实例 名词: 1.统计维度(说明数据) 维度就是统计致力于建立一个基于多方位统计(时间.地 ...
- geotrellis使用(二十三)动态加载时间序列数据
目录 前言 实现方法 总结 一.前言 今天要介绍的绝对是华丽的干货.比如我们从互联网上下载到了一系列(每天或者月平均等)的MODIS数据,我们怎么能够对比同一区域不同时间的数据情况,采用 ...
- EasyUI datagrid动态加载json数据
最近做一个项目,要求是两张张表可能查找出10多种不同的结果集. 如果想只用一个表格就把全部的结果不同的显示出来那么就肯定不同使用固定的字段名字,要通过动态加载后台返回来的数据把它显示出来就必须动态加载 ...
- Echarts使用及动态加载图表数据 折线图X轴数据动态加载
Echarts简介 echarts,缩写来自Enterprise Charts,商业级数据图表,一个纯JavaScript的图表库,来自百度...我想应该够简洁了 使用Echarts 目前,就官网的文 ...
- eCharts动态加载各省份的数据
假如从数据库读出以下数据,如何将数据展示在地图之上 1.部门的名称数据: List deptname=[联通事业部-上海联通项目组, 联通事业部-河南联通项目组, 联通事业部-贵州联通项目组, 联通事 ...
- C#曲线分析平台的制作(四,highcharts+ajax加载后台数据)
在上一篇博客:C#曲线分析平台的制作(三,三层构架+echarts显示)中已经完成了后台的三层构架的简单搭建,为实现后面的拓展应用开发和review 改写提供了方便.而在曲线分析平台中,往往有要求时间 ...
- dhtmlxtree动态加载节点数据的小随笔
最近做了一个这个东西,颇有些感触,随笔记录一下自己的过程. 首先特别感谢:https://blog.csdn.net/cfl20121314/article/details/46852591,对我的帮 ...
随机推荐
- mysql 异步执行 query //@todo
http://stackoverflow.com/questions/27240421/php-asynchronous-mysql-query http://php.net/manual/en/my ...
- nodejs初探(四)实现一个多人聊天室
我们实现的思路是,当有一个人发送过来消息,我们就广播给其他客户端. var net = require('net'); var chatServer = net.createServer(), cli ...
- [HTML] CSS3 圆角
使用 CSS3 border-radius 属性,你可以给任何元素制作 "圆角". CSS3 border-radius 属性 使用 CSS3 border-radius 属性,你 ...
- css学习笔记(8)
1.元素使用了float以后就脱离了文档流,不能通过margin:0 auto;来居中了. 2.position:relative;定位后可以通过margin:0 auto;来居中,也说明了relat ...
- SQL中ISNULL用法示例
ISNULLSQL查询示例SELECT ISNULL 使用指定的替换值替换 NULL. 语法 :ISNULL ( check_expression , replacement_val ...
- Mysql备份迁移——MySqlBackup(.net)——(无法解决视图嵌视图报错)
这里是利用MySqlBackup,可以再nuget中下载. 无法解决视图嵌视图报错的问题,只导表跟数据比较合适,如果有视图嵌视图,请参照Mysql备份迁移——Mysqldump(.NET调用Mysql ...
- 【练习】移动数据----infile *
要求: ①指定bad文件: ②挂在之前将目标表delete: ③导入的的数据在控制文件中. 1.创建目录对象: :: SYS@ORA11GR2>create or replace directo ...
- js获取节点的DOM操作
一直感觉DOM节点什么的乱七八糟的不能理解,可能博客也没办法写清楚,只能把知道的一些信息大致写下来慢慢再补充了. HTML DOM类型 Node类型 Javascript中的所有节点类型都继承自Nod ...
- CSS盒子模型学习记录1
http://www.blueidea.com/tech/web/2007/4545.asp 代码试验: html代码: <!DOCTYPE html PUBLIC "-//W3C// ...
- HttpURLConnection下载图片的两种方式
public class MainActivity extends AppCompatActivity { private ImageView iv; private String imageurl ...