IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> Echart折线图横坐标时间获取 -> 正文阅读

[JavaScript知识库]Echart折线图横坐标时间获取

Echarts

折线图的js

option = {
  xAxis: {
    type: 'category',
    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: [150, 230, 224, 218, 135, 147, 260],
      type: 'line'
    }
  ]
};

PS

因项目需要,前端需要展示折线图,我需要写接口,返回一周内的数据
默认是今天到前六天,一共七天
我需要在数据库根据创建时间,查询每天新增数据的总数
那么,问题来了?
我怎么获取今天和前六天的日期呢?
我又不能在代码里面写死,每天日期不同。
我在数据库查询的话,是时间范围查询,使用between
范围的话是每天的00:00:00 到 23:59:59
这样有怎么获取呢?
我想了一下午,都没想到一个好办法。。。

resolve

晚上回来了我想到了hutool的工具类,查一下资料,再到idea写个测试类一测,OK,完美搞定,明天工作中就可以用到啦。ooo 太不容易啦!!!晚上回来都还在想办法。。。
上代码:

public static void week() {
        DateTime dateTime = DateUtil.lastWeek();
        System.out.println("开始时间" + dateTime);
        System.out.println("---------------");
        DateTime startTime = DateUtil.beginOfDay(dateTime);
        DateTime endTime = DateUtil.endOfDay(dateTime);
        for (int i=1;i<8;i++){
            DateTime dateTime1 = DateUtil.offsetDay(startTime, i);
            System.out.println(dateTime1);
            DateTime dateTime2 = DateUtil.offsetDay(endTime, i);
            System.out.println(dateTime2);
            System.out.println("========");
            // 这里可以执行数据库的查询操作,前面声明一个list集合,然后将结果添加进集合里面
        }
    }
}

运行结果

开始时间2021-11-11 21:59:08
---------------
2021-11-12 00:00:00
2021-11-12 23:59:59
========
2021-11-13 00:00:00
2021-11-13 23:59:59
========
2021-11-14 00:00:00
2021-11-14 23:59:59
========
2021-11-15 00:00:00
2021-11-15 23:59:59
========
2021-11-16 00:00:00
2021-11-16 23:59:59
========
2021-11-17 00:00:00
2021-11-17 23:59:59
========
2021-11-18 00:00:00
2021-11-18 23:59:59
========

Process finished with exit code 0

非常完美,如果前端也需要你传横坐标的值,也非常简单,使用
String today = DateUtil.today(); 表示今天时间yyyy-MM-dd
这个的结果为yyyy-MM-dd,当天的日期
在写一个for循环,往前面-6,-5,一直到减0,就出来啦。
也是非常简单的

总结

hutool的工具类非常好用,多学习一下,总结一下,可以省好多代码。哈哈,我要多去学一学这些工具类。。。

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-11-19 17:32:40  更:2021-11-19 17:34:11 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年5日历 -2024/5/20 22:22:49-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码