【时间】jquery 实现 只获取当前时间 以前的数据

想要实现的效果是,

当前时间 是 10:01 分, 数据 只显示 10:00一个时间点的数据
当前时间 是 10:16 分, 数据 显示 10:00,10:15 两个时间点的数据
当前时间 是 10:46 分, 数据 只显示 10:00,10:15,10:30 三个时间点的数据

在这里插入图片描述
在这里插入图片描述

  $(function() {
  // 图表模块

  // // 获取当前时间
  var date = new Date();
  var month = date.getMonth();
  var month1 = date.getMonth() + 1;
  var strDate = date.getDate();
  var hours = date.getHours();
  var minutes = date.getMinutes();
  var seconds = date.getSeconds();
  if (month1 >= 1 && month1 <= 9) {
    month1 = "0" + month1;
  }
  if (strDate >= 0 && strDate <= 9) {
      strDate = "0" + strDate;
  }
  if (hours >= 0 && hours <= 9) {
      hours = "0" + hours;
  }
  if (minutes >= 0 && minutes <= 9) {
      minutes = "0" + minutes;
  }
  if (seconds >= 0 && seconds <= 9) {
      seconds = "0" + seconds;
  }

  var allzongliang = 0; // 总发电量
  // 基于准备好的dom,初始化echarts实例
  var myChart = echarts.init(document.getElementById('main'));
  var option;
  // 指定图表的配置项和数据
    option = {
      //控制整个图表的大小 和 位置
      grid:{
        left: '40px',
        bottom: 30,
        top: '5%',
        right: '5%'
      },
      tooltip: {
        trigger: 'axis'
      },
      xAxis: {
        type: 'category',
        // boundaryGap: false, //从x轴顶格开始
        data: [0]
      },
      yAxis: {
        type: 'value',
        name: 'kWh',
        // axisLabel: {
        //   formatter: '{value} kWh' // 设置单位
        // },
      },
      series: [
        {
          data: [0],
          type: 'line', //   type: 'bar',柱形图
          symbol: 'none', //折线上的空心圆点 不显示
          smooth: true, // 开启平滑
          color: ['#36DB9B'],
          lineStyle: {
            color: '#B8FFE6', // 折线颜色
          },
          // 区域面积渐变样式配置
          areaStyle: { 
            color: {
              type: 'linear',
              x: 0,
              y: 0,
              x2: 0,
              y2: 1,
              colorStops: [{
                offset: 0,
                color: '#B8FFE6' // 0% 处的颜色
              }, {
                offset: 1,
                color: '#0BE99D' // 100% 处的颜色
              }],
              global: false // 缺省为 false
            }
          },
        }
      ]
    };


  // 日数据 star================================= 只显示 当前时间往前的时间 假如是17:14分 只显示 17点14分之前的数据
  bigdata();
  function bigdata(){

    var rix = [];
    var ridata = [];

    function getridata(){
      allzongliang = 0;

      var ridate = new Date();
      var rih = ridate.getHours();
      var rim = ridate.getMinutes();
      var ris = ridate.getSeconds();

      // 假设时间 模拟用
      // var rih = 11;
      // var rim = 46;

      if (rih >= 0 && rih <= 9) {
        rih = "0" + rih;
      }
      if (rim >= 0 && rim <= 9) {
        rim = "0" + rim;
      }
      // console.log(rih,rim,ris,'当前时分秒')
    
      ridata = [];
      rix = [];

      $.each(shebeiArr, function(i, item) {

         // 拆分 时和分
         item.shi = item.time.match(/(\S*):/)[1];
         item.fen = item.time.match(/:(\S*)/)[1];

          /*
              当前时间和 数据的时间 做对比
              先获取 已经过去所有时间
              再获取,在哪个时间刻度内,显示
          */ 
         if(rih > item.shi){
            rix.push(item.time);
         }

         if(rih == item.shi){
          // 当前 小时时间内   分钟判断
          // 小于 45的, 00,15,30 都可以push
          // 小于 30的,00,15,都可以push
          // 小于 15的,00 可以push

          if((rim*1 >0 && rim*1 < 15) && (item.fen*1 >= 0 && item.fen*1 < 15)  ){
            rix.push(item.time);
          } else if(  (rim*1 < 30 && rim*1 > 15) && (item.fen*1 >= 0 && item.fen*1 < 30)){
            rix.push(item.time);
          }  else if((rim*1 < 45 && rim*1 > 30) && (item.fen*1 >= 0 && item.fen*1 < 45)){
            rix.push(item.time);
          } else if((rim*1 >= 45) && (item.fen*1 >= 0)){
            rix.push(item.time);
          }


        }

         var zong = 0;
         $.each(item.data, function(ii, itemdata) {
           $.each(itemdata, function(iii, itemdatai) {
             zong+=Number(itemdatai);
           });
         });
         zong = zong.toFixed(3);
         ridata.push(zong);


         option.xAxis.data = rix;
         option.series[0].data = ridata;
         $(".zongliang").html(allzongliang);
      });

    }

    getridata();
    setInterval(getridata,1000);
    myChart.setOption(option);

  }
});
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值