echarts如何设置日期类型的x轴

 时间:2024-10-13 11:05:37

1、该方法传入两个参数,一个是x轴所需参数的个数,一个是时间间隔的粒度。这里时间格式化为年-月-日的形式,根据自己的需要调整时间格式就行。

echarts如何设置日期类型的x轴

2、返回的数据是一个格式化好的时间数组。如,调用getDateList(7,24*60*60*1000),得到如下最近七天日期年月日格式化的数组:

echarts如何设置日期类型的x轴

3、若将时间格式调整为“HH:mm”,调用getDateList(24,60*60*1000),就能得到最近24小时间隔粒度为1小时的数组:

echarts如何设置日期类型的x轴

4、绘制一个简单的折线图,调用上面的方法,得到一个七天哪膀仑碍日期年月日格式化的数组,将数组传给xAxis的data中,然后在series中传入具体数据就可以得到一个最近七天日期为x轴刻度的折线图。

echarts如何设置日期类型的x轴

5、效果如下:

echarts如何设置日期类型的x轴

6、数组换成最近七小时,效果如下:

echarts如何设置日期类型的x轴

7、官方的实例也是像xAxis的data中传入了一个数组,我们只不过是将数组用一个方法提前组装好罢了,想要什么样的数据就组装成什么样的数据。

echarts如何设置日期类型的x轴
  • HTML5,日期控件使用
  • js如何从指定的字符串中获得指定位置一个字符
  • Mysql:如何导出Navicat中查询的数据?
  • echarts柱状图宽度设置
  • [VS2017使用]创建Windows桌面应用程序项目[TZZ]
  • 热门搜索
    短途旅游推荐 美国洛杉矶旅游攻略 哈尔滨旅游局 旅游年卡 江苏无锡旅游 铜川旅游景点大全 暑假去哪旅游好 防城港旅游景点大全 内蒙古旅游路线 西递宏村旅游攻略