zoukankan      html  css  js  c++  java
  • Echarts动态加载后台数据

    注意:1、用Ajax请求获取后台数据 2、Echarts只能处理Json数据

    后台Controller:根据业务需求不同而返回不同数据,我前台要循环遍历Echarts的series进行数据添加,所以后台返了个二维数组过去。

    5

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

    jsp

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

    js1

    定义一个为series这个即将动态加入数据的配置项准备的名为Item的数组容器,

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

    最后再设置Echarst相关配置项。

    js2

  • 相关阅读:
    C++输入问题探究
    剑指offer自学系列(一)
    一道算法题加深我对C++中map函数的理解
    数据结构和算法自学之排序算法(一)
    pyqt5_01_流程走通
    最新谷歌驱动对照表
    移动端测试
    selenium封装
    request封装
    MD5自定义加密
  • 原文地址:https://www.cnblogs.com/wfaceboss/p/6050454.html
Copyright © 2011-2022 走看看