Echarts中series循环添加数据

1.首先定义变量

2.根据后台查询出来的数据循环添加到变量中

var series = [];
for (var i = 0, size = data.dataList.length; i < size; i++) {
  legendData.push(data.dataList[i].sjjc);
  series.push({
    name: data.dataList[i].sjjc,
    type: ‘line‘,
    smooth: true,
    label: {
      normal: {
        show: true,
        position: ‘top‘,
        color: ‘#424242‘,
        fontSize: 12,
      }
    },
    data: [data.dataList[i].yf1 , data.dataList[i].yf2 , data.dataList[i].yf3 , data.dataList[i].yf4 , data.dataList[i].yf5 ,
      data.dataList[i].yf6 , data.dataList[i].yf7 , data.dataList[i].yf8 , data.dataList[i].yf9 , data.dataList[i].yf10 ,
      data.dataList[i].yf11 , data.dataList[i].yf12]
  });
}

3.赋值到Echarts中的series属性中

/* 第13个图表的配置--加油站年销售情况图 --折线图*/
var option13 = {
  title: [{
    //text: ‘2019年加油站年销售情况图‘,
    text: titleText,
    left: ‘center‘,
    textStyle: {
      color: ‘#4c4c4c‘,
      fontWeight: "bold",
      fontSize: 16,
    },
    }, {
      text: ‘单位:(万元)‘,
      left: ‘right‘,
      textStyle: {
      color: ‘#929292‘,
      fontWeight: "normal",
      fontSize: 12,
    },
  }],
  legend: {
    //data: [‘中石油102‘, ‘大平五一路‘, ‘中通‘, ‘和源‘, ‘德月‘, ‘铭磊‘, ‘高桥‘, ‘大平汽贸城‘, ‘天盈‘, ‘宝光‘, ‘燕港‘, ‘顺达‘, ‘长城‘],
    data: legendData,
    bottom: 0
  },
  tooltip: {
    trigger: ‘axis‘,
    axisPointer: {
      type: ‘cross‘
    },
    formatter:function(params){
      var res = params[0].name;
      for (var i = 0; i < params.length; i++) {
        res += "<br>"+params[i].marker+params[i].seriesName+":"+formatThousand2(params[i].data);
      }
      return res;
    }
  },
  dataZoom: [{
    type: ‘inside‘,
  }],
  toolbox: {
    show: true, //是否显示工具箱
    right: 70,
    top: -8,
    //要显示的工具箱内容
    feature: {
      saveAsImage: { //保存为图片
        show: true
      },
    }
  },
  grid: {
    top: ‘30‘,
    left: ‘1%‘,
    right: ‘1%‘,
    bottom: ‘40‘,
    containLabel: true,
  },
  xAxis: [{
    data: [‘1月‘, ‘2月‘, ‘3月‘, ‘4月‘, ‘5月‘, ‘6月‘, ‘7月‘, ‘8月‘, ‘9月‘, ‘10月‘, ‘11月‘, ‘12月‘],
  }],
  yAxis: [{
    type: ‘value‘,
    axisTick: {
      show: false,
    },
  }],
  series : series
};

原文地址:https://www.cnblogs.com/chuanqi1995/p/11387423.html

时间: 2024-09-29 22:43:18

Echarts中series循环添加数据的相关文章

创建存储过程向表中循环添加数据

CREATE PROCEDURE dowhile() BEGIN DECLARE n int; set n=1; WHILE n<=1000 do INSERT into hasindex(num) VALUES (n); set n=n+1; END WHILE; END; CALL dowhile();创建存储过程向表中循环添加数据

jmeter登录后循环添加数据

这篇博客时的背景: 做测试环境的配置初始化操作,系统不支持导入功能,只能通过接口去添加数据,测试环境添加的规则比较多一条一条的手动添加  嫌麻烦 操作步骤 1.准备规则数据(使用的cvs文件) 2.通过浏览器抓取添加规则请求数据包,得到请求接口 3.jmeter中线程下添加 循环控制器(循环次数为cvs文件中数据条数) 4.循环控制器 下添加 CSV Data Set Config 5.设置 CSV Data Set Config:Filename设置为cvs文件绝对路径,变量设置(在cvs文件

【WinForm】线程中向listview添加数据

在使用listview的时候,因为处理的数据较多,为防止在处理数据时出现假死的状态出现卡的情况,我们使用委托进行处理添加数据 定义委托 private delegate void AddListView(ListViewItem item); 定义添加数据的方法 /// <summary> /// /// </summary> /// <param name="item"></param> private void AddListView

bash中for循环添加10个用户和删除10个用户

1. 循环添加10个用户: #!/bin/bash# for i in {1..10}; do    if id user$i &> /dev/null; then        echo "user$i exists."    else        useradd user$i        echo user$i | passwd --stdin user$i &> /dev/null        echo "add user user$i

Mysql数据库中 ,涉及事物,循环添加数据

1 create PROCEDURE Usp_AddBoradCast 2 ( 3 in subjects VARCHAR(200), 4 in detail  text, 5 in useid int, 6 in isdelete int, 7 in confirm INT, 8 in time DateTime, 9 in acceptUserId VARCHAR(500),10 in isread INT11 12 )13 BEGIN14 declare cnt int default 0

thinkphp模板中foreach循环没数据的错误解决

从控制器方法中$this->assign();函数将值传递给html模板 但是模板不显示数据,直接出来的是代码,效果就和html中写了php代码不能解析一样. 原来是我将thinkphp框架的引擎和smarty模板引擎的使用方法混了.写成了 查手册知道了thinkphp模板中foreach的使用方法,这才恍然大悟

在Java中向MySQL添加数据,statement

import java.sql.Connection; import java.sql.DriverManager; import java.sql.ResultSet; import java.sql.SQLException; import java.sql.Statement; import java.util.ArrayList; import java.util.List; public class QueryDemo { public static void main(String[

jsp页面中Sql server 添加数据

myeclip 与 sql server 搭配真心不好使用,bug太多Google和百度我来回检索了几个小时一些bug都还不能解决,大部分都是JDBC问题. 问题:当 IDENTITY_INSERT 设置为 OFF 时,不能为表 'article' 中的标识列插入显式值. 解决: 我的递增列是id,但insert时此列不用写,能自动加1 错误写法:insert into article (id,pid,rootid,title,cont,pdate,isleaf)values(null,0,1,

pb中share外添加数据的办法

需求:在前台显示上面有[出库科室] 但是在打印出来却没有,于是就想加上, ---------------------------------------- 解决思路:找到了出库单,从sql里面添加个字段,取出来放上面 于是在d_yf_kcgl_ck02_print的sql里面加了yf_ck01.ckks,然后把他的值放到合适的位置, 然后打印的