ECharts使用心得

简介: ECharts百度旗下图标插件,在展示地图、雷达图等方面有很好的支持。   应用场景: 自动生成X轴的数据: 设置:xAxis的type=value || type=time 并且设置series的data为二维数组,第一位是X轴的值,第二位是Y轴的值,例如: series: [ { //.

ECharts百度旗下图标插件,在展示地图、雷达图等方面有很好的支持。

 

应用场景:

自动生成X轴的数据:


设置:xAxis的type=value || type=time 并且设置series的data为二维数组,第一位是X轴的值,第二位是Y轴的值,
例如:

series: [
        {
            //...
            data: [[1456329600000,2314.24],[1456502400000,2030]]
        }
]

echarts支持2种时间格式:

  ①、一种是中国的时间例如:“2016-10-10 10-10-10”;

  ②、另一种支持时间戳,精确到微秒(13位时间戳)。

 

常用方法

一、格式化时间格式:

echarts.format.formatTime('yyyy-MM-dd', new Date());

二、格式化X轴数据格式代码:

xAxis: {
    //…
    axisLabel:{
        formatter:function (value)
        {
            return echarts.format.formatTime('MM-dd', new Date(value));
        }
    }
}    

 

img_fa0be433d68c8212b2b0b3b1a564ccb1.png
如果本文对你有所帮助,请打赏——1元就足够感动我:)
支付宝打赏 微信打赏
联系邮箱:intdb@qq.com
我的GitHub: https://github.com/vipstone
关注公众号: img_9bde0f31ac4a0eca10b1bd7414b78faf.png


作者: 王磊
出处: http://vipstone.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,请标明出处。

相关文章
|
5月前
|
数据可视化 JavaScript 搜索推荐
ECharts入门了解及使用
ECharts入门了解及使用
47 0
|
11天前
|
Web App开发 数据可视化 前端开发
ECharts 教程
ECharts 是一个使用 JavaScript 实现的开源可视化库,涵盖各行业图表,满足各种需求。
43 10
|
5月前
|
数据可视化 前端开发 定位技术
ECharts前端教程
ECharts前端教程
100 3
|
5月前
|
编解码 数据可视化 前端开发
ECharts 对比 Highcharts 使用教程
ECharts 对比 Highcharts 使用教程
107 1
|
11月前
|
JavaScript 前端开发 CDN
echarts入门
echarts入门
47 0
|
11月前
|
JSON 前端开发 JavaScript
从零开始学习React-五分钟上手Echarts折线图(十)
从零开始学习React-五分钟上手Echarts折线图(十)
152 0
|
JSON 数据格式
Echarts笔记
之前在后台已经把数据全部获取好了,也封装位Json格式,但是到前台饼图上却无法显示,原因是传到页面的是一个List集合,无法一个一个的分配给相应的模块(柱形图可以自动显示),最后在前台进行遍历,就能显示了。
60 0
|
Web App开发 移动开发 数据可视化
学习echarts入门
学习echarts入门
117 0
|
JavaScript CDN 容器
Echarts入门
Echarts入门
557 0
Echarts入门
|
移动开发 JSON 开发框架
基于React+Koa实现一个h5页面可视化编辑器-Dooring | 🏆 技术专题第三期征文
前段时间笔者一直忙于数据可视化方面的工作,比如如何实现拖拽式生成可视化大屏,如何定制可视化图表交互和数据导入方案等,这块需求在B端企业中应用非常大,所以非常有探索价值。
527 0