• Echarts自定义图表显隐开关


    1. 插入折线
      // 插入折线
      function appendLineToChart(name, data, zeroData) {
          var line = {
              name: name,
              type: 'line',
              xAxisIndex: 0,
              smooth: false,
              connectNulls: true,
              data: data,
              markLine: {
                  lineStyle: {
                      type: 'dashed'
                  },
                  data: zeroData
              }
          }
          option.series.push(line);
          chart.setOption(option);
      }
    2. 清除折线
      function removeLineFromChart(name) {
          var index = -1;
          for (var i = 0; i < option.series.length; i++) {
              if (option.series[i].name == name) {
                  index = i;
                  break;
              }
          }
      
          if (index > -1) {
              option.series.splice(index, 1);
              chart.setOption(option, true);  // 设置option不合并(覆盖)
          }
      }
    3. 对于其中的交互和传值可以动态的去创建对象
      function parseSkData(skData, dataInfo) {
      
          var skTime = dataInfo.time;
          var skAgingType = dataInfo.skAgingType;
          var fileName = getSKFileName(skTime, skAgingType);
      
          data = skData["stationDataList"];
      
          var Station = {};
      
          Station[fileName + ':tmp'] = new Array();
          Station[fileName + ':dp'] = new Array();
          Station[fileName + ':tmp_zero'] = null;
      
      
          if (!(data == null || data == undefined || data == '')) {
              /*获取折线折点*/
      
              for (var i = 0; i < data.length; i++) {
                  var line = data[i];
                  var _dew = line.dew;
                  var _height = line.height;
                  var _hpa = line.hpa;
                  var _tmp = line.tmp;
                  var _winDir = line.winDir;
                  var _winSpeed = line.winSpeed;
      
                  _dew = _dew == 9999 ? '-' : _dew;
                  _height = _height == 9999 ? '-' : _height;
                  _hpa = _hpa == 9999 ? '-' : _hpa;
                  _tmp = _tmp == 9999 ? '-' : _tmp;
                  _winDir = _winDir == 9999 ? '-' : _winDir;
                  _winSpeed = _winSpeed == 9999 ? '-' : _winSpeed;
      
                  Station[fileName + ':tmp'][i] = new Array(_tmp, _hpa);
                  Station[fileName + ':dp'][i] = new Array(_dew, _hpa);
              }
      
              Station[fileName + ':tmp_area_data'] = [];
              Station[fileName + ':tmp_zero'] = calcZero(data, 'tmp', Station[fileName + ':tmp_area_data']);
      
              /*计算冷暖层强度*/
              if (Station[fileName + ':tmp_zero'].length > 1) {
                  Station[fileName + ':tmp_areas'] = [];
                  Station[fileName + ':tmp_areas'] = calAreas(Station[fileName + ':tmp_area_data']);
              }
          }
          return Station;
      }
  • 相关阅读:
    05-浮动/css
    04-选择器/css
    03-样式表/css
    02-html标签&表格&表单
    01-html基础&标签
    vue分页组件重置到首页问题
    VUE通过索引值获取数据不渲染的问题
    常见IE8兼容性问题及解决
    Ajax
    sea.js模块化工具
  • 原文地址:https://www.cnblogs.com/unique1319/p/9157183.html
Copyright © 2020-2023  润新知