每次查echarts的官网上边的配置项不知道分别代表什么,必须点开才知道,所以在这做下Echarts配置项的简单记录

最外层的配置项:

  1. title:进行标题与副标题的显示隐藏,位置,字体颜色,字体大小,边框,背景颜色,阴影的设置
  2. legend:图例的控制:显示隐藏、位置、宽高、类型、布局朝向、内容的对齐方式、每项的间隔、标记宽高、格式化图例文本、图例选择模式、字体样式
  3. grid:坐标系的控制:坐标系的显示隐藏、最多可以放置两个x轴和y轴,坐标系的宽高、位置、边框、背景颜色、阴影、tooltip提示框
  4. xAxis:x轴的配置,一般最多放置两个,多个的话设置offset防止重叠,x轴的类型(值,分类,时间,对数)x轴名称,名称位置,名称的文字样式,名称与轴线的距离,是否反向,坐标轴两边留白,刻度的最小值,刻度最大值,是否显示零刻度,坐标轴分隔段数,坐标轴最大最小间隔大小,对数轴的底数,轴线的设置,轴刻度的设置,刻度标签的设置,刻度上的数据,
  5. yAxis:Y轴的控制,控制内容与X轴一样
  6. polar:极坐标系的控制,极坐标的中心位置、半径、提示框组件
  7. radiusAxis极坐标系的径向轴:坐标轴类型、名称、名称显示位置、名称的样式、名称与轴线的距离、旋转角度、留白、刻度最大最小值、其他与直角坐标系的设置相同
  8. angleAxis:极坐标系的角度轴,与其他坐标系的轴设置相似
  9. radar:雷达坐标系组件,与其他坐标系的轴设置相似
  10. 用于控制区域缩放的,可以通过inside鼠标滚轮进行缩放(内置的缩放),slider拖动滑块缩放(外置的缩放控制)
  11. visualMap:视觉映射组件
  12. tooltip提示框组件,可以设置在全局、坐标系、series系列中、系列的每个数据项中,可以设置显示隐藏,触发类型,坐标轴指示器配置项、触发条件结束是否显示提示框、显示隐藏的延时、位置、内容格式化、样式
  13. axisPointer:坐标轴提示器
  14. toolbox:工具栏, 导出图片、数据视图、动态类型切换、数据区域缩放、重置,工具栏图标的方向、大小、间隔、悬停显示内容、位置
  15. brush 是区域选择组件,用户可以选择图中一部分数据,从而便于向用户展示被选中数据,或者他们的一些统计计算结果
  16. geo:地理坐标系组件,地图上设置散点图,线集,区域的颜色series-map中设置,地图的缩放,当前视角的中心点,地图的长宽比,左上角右下角对应的经纬度,视角的缩放比例,滚轮缩放的极限控制,组件的位置,地图大小,
  17. parallelAxis平行坐标系
  18. timeline多个echarts option间切换、播放,设置自动播放,方向播放,循环播放,播放速度,播放按钮的位置
  19. graphic原生图形元素组件
  20. calendar日历坐标系组件
  21. dataset对数据集进行统一管理被多个组件复用
  22. series系列列表,每个系列通过type决定自己的图表类型
  23. animation开始的是动画相关的

echarts的最外层配置项的更多相关文章

  1. echarts常见配置项总结,legend、toolbox、tooltip等

    1.饼状图指示线改变颜色:series.labelLine.lineStyle series : [ { name: '默认文字', type: 'pie',//类型饼状图 hoverAnimatio ...

  2. 关于ECharts Java类库的一个jquery插件

    在项目中开发图表功能时用到了Echars和一个关于Echars的java类库(http://git.oschina.net/free/ECharts).这个类库主要目的是方便在Java中构造EChar ...

  3. echarts在react项目中的使用

    数据可视化在前端开发中经常会遇到,万恶的图表,有时候总是就差一点,可是怎么也搞不定. 别慌,咱们一起来研究. 引入我就不多说了 npm install echarts 对于基础的可视化组件,我一般采用 ...

  4. 基于 ECharts 封装甘特图并实现自动滚屏

    项目中需要用到甘特图组件,之前的图表一直基于 EChart 开发,但 EChart 本身没有甘特图组件,需要自行封装 经过一番鏖战,终于完成了... 我在工程中参考 v-chart 封装了一套图表组件 ...

  5. ECharts学习指南

    1.了解ECharts ECharts简单说就是互联网开发程序过程中,后台数据库用以实现数据到图形的映射的一个插件. 具体来说一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在PC和 ...

  6. 使用百度echarts仿雪球分时图(一)

    第一次写技术博客,有不足的地方希望大家指证出来,我再加以改正,谢谢大家. 之前一直没有找到一个合适的分时图项目,所以决定自己动手撸一个.接触的图表框架不多,在网上看到不少人推荐使用echarts,看了 ...

  7. 使用百度echarts仿雪球分时图(四)

    这章节来收拾一下一些小BUG,顺便把各个小提示信息也补上,分时图也就完成了. 上章节末尾提到的一个bug,就是第一个grid跟第三个grid之间是断开的,折线并没有连在一起,所以先来收拾这个问题.没有 ...

  8. 使用百度echarts仿雪球分时图(三)

    这章节将完成我们的分时图,并使用真实的数据来进行展示分时图. 一天的交易时间段分为上午的09:30~11:30,下午的13:00~15:00两个时间段,因为分时间段的关系,数据是不连续的,所以会先分为 ...

  9. 使用百度echarts仿雪球分时图(二)

    上一章简单的介绍了一下分时图的构成,其实就是折线图跟柱状图的组成.本来这章打算是把分时图做完,然后再写一章来进行美化和总结,但是仔细观察了一下,发现其实东西还是有点多的.分时图的图表做完后,还要去美化 ...

随机推荐

  1. 重新学习Spring注解——AOP

    面向切面编程——思想:在一个地方定义通用功能,但是可以通过声明的方式定义这个功能要以何种方式在何处运用,而无须修改受影响的类. 切面:横切关注点可以被模块化为特殊的类. 优点: 1.每个关注点都集中在 ...

  2. 三块sm865组建RAID0

    介绍 使用三块sm865组件raid0,cpu为6700k,主板为华硕的z170-A 这里使用的是主板自带的raid0,不是win10自带的带区卷 CrystalDiskMark AS SSD Ben ...

  3. eclipse 导入项目后,在工程图标上出现红叉,但是工程中的文件并没有提示错误的解决方法

    进入项目包下的.settings目录,找到org.eclipse.wst.common.project.facet.core.xml文件,用记事本打开后才发现这句话有问题:<runtime na ...

  4. apt-get update失败处理:*** Error in `appstreamcli': double free or corruption (fasttop): 0x00000000015c4bf0 ***

    好像只要卸载一个东西就可以了(至少我的是这样): sudo apt-get purge libappstream3 再重新执行update命令, sudo apt-get update 参考链接: 1 ...

  5. appache开启自定义404错误并编写404.html

    1,让apache支持.htaccess 我们要找到apache安装目录下的httpd.conf文件,在里面找到 <Directory /> Options FollowSymLinks ...

  6. requests-html

    目录 一 介绍 二 安装 三 如何使用requests-html 四 支持JavaScript 五 自定义User-Agent 六 模拟表单提交 七 支持异步请求 一 介绍 Python上有一个非常著 ...

  7. Candy Treasure Box

    This is an interesting puzzle game. In the game, you need to use your brain, think carefully, operat ...

  8. SQL Server 默认跟踪(Trace)捕获事件详解

    SQL Server 默认跟踪 -- 捕获事件详解 哪些具体事件默认跟踪文件能够捕获到? --returns full list of events SELECT * FROM sys.trace_e ...

  9. ABP abp zreo 老版本 支持dotnet framework 4.0

    下载了个abp zreo的老版本,module-zero-template-1.5.1, 只有这个版本支持.net framework4.0,其它都依赖.net framework 4.5和4.6去了 ...

  10. axios二次封装

    import axios from "axios" //请求拦截器 axios.interceptors.request.use(function (config) { retur ...