• echarts循环数据实列


    如下图表的循环简单方法

    1
    echarts循环试列
    data为后台获取数据 类型为 List<Map>
    
    
     1 getroeadSectionChartsOption: function (data) {
     2         var me = this;
     3         var xAxisData = [], seriesData = [],
     4             legendData = ["PCI", "RQI", "RDI", "SIR", "PQI", "SCI", "BCI", "TCI", "MQI", "PSSI"];
     5         var currentYear = new Date().getFullYear();
     6         for (var i = currentYear - 4; i <= currentYear; i++) {
     7             xAxisData.push(i + '年')
     8         }
     9         // debugger
    10         // 的到年份
    11         legendData.forEach(function (item) {
    12             seriesData.push({
    13                 name: item,
    14                 type: 'line',
    15                 stack: '总量',
    16                 data: getData(item.toLocaleLowerCase())
    17             });
    18         });
    19         function getData(item) {
    20             var d = []
    21             xAxisData.forEach(function (year, i) {
    22                 data.baseCheckDto.forEach(function (dto, j) {
    23                     if (year.indexOf(dto.checkYear) > -1) {
    24                         if (!dto[item]) {
    25                             d.push(0);
    26                         } else {
    27                             d.push(dto[item])
    28                         }
    29                     }
    30                 })
    31                 if (typeof(d[i]) == 'undefined') {
    32                     d.push(0);
    33                 }
    34             })
    35             return d
    36         }
    37 
    38 
    39         /* data.baseCheckDto.forEach(function (item, i) {
    40          xAxisData.forEach(function (year) {
    41          if(){
    42 
    43          }
    44          })
    45          seriesData.forEach(function (val, j) {
    46          seriesData[j].data[j] = item[val.name.toLocaleLowerCase()]
    47          })
    48          })*/
    49         var option = {
    50             title: {
    51                 text: '近五年检测数据'
    52             },
    53             tooltip: {
    54                 trigger: 'axis'
    55             },
    56             legend: {
    57                 data: legendData
    58             },
    59             grid: {
    60                 left: '3%',
    61                 right: '4%',
    62                 bottom: '3%',
    63                 containLabel: true
    64             },
    65             toolbox: {
    66                 feature: {
    67                     saveAsImage: {}
    68                 }
    69             },
    70             xAxis: {
    71                 type: 'category',
    72                 boundaryGap: false,
    73                 data: xAxisData
    74             },
    75             yAxis: {
    76                 type: 'value'
    77             },
    78             series: seriesData
    79             /*[
    80              {
    81              name: '邮件营销',
    82              type: 'line',
    83              stack: '总量',
    84              data: [120, 132, 101, 134, 90, 230, 210]
    85              },
    86 
    87              {
    88              name: '搜索引擎',
    89              type: 'line',
    90              stack: '总量',
    91              data: [820, 932, 901, 934, 1290, 1330, 1320]
    92              }
    93              ]*/
    94         };
    95         return option;
    96 
    97     }
    
    
    
     
  • 相关阅读:
    重写保存按钮save事件
    隐藏列获取不到值,表格选中行提示未选中
    前后台获取上下文context
    editGrid分录表格
    通用查询-高级查询
    js保留位和取整
    在Visual Studio中使用C++创建和使用DLL
    Lua中的一些库(1)
    Lua中的面向对象编程
    Lua中的模块与包
  • 原文地址:https://www.cnblogs.com/MythLeige/p/11016844.html
Copyright © 2020-2023  润新知