`
dwj147258
  • 浏览: 194764 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

ECharts学习总结(五):echarts的Option概览

阅读更多

option

图表选项,包含图表实例任何可配置选项: 公共选项 , 组件选项 , 数据选项

名称 描述
{color} backgroundColor 全图默认背景,(详见backgroundColor),支持rgba,默认为无,透明
{Array} color 数值系列的颜色列表,(详见color),可配数组,eg:['#87cefa', 'rgba(123,123,123,0.5)','...'],当系列数量个数比颜色列表长度大时将循环选取
{boolean}renderAsImage 非IE8-支持渲染为图片,(详见renderAsImage
{boolean} calculable 是否启用拖拽重计算特性,默认关闭,(详见calculable,相关的还有 calculableColor, calculableHolderColor, nameConnector, valueConnector
{boolean} animation 是否开启动画,默认开启,(详见 animation,相关的还有 addDataAnimation, animationThreshold, animationDuration, animationDurationUpdate animationEasing
{Object} timeline 时间轴(详见timeline),每个图表最多仅有一个时间轴控件
{Object} title 标题(详见title),每个图表最多仅有一个标题控件
{Object} toolbox 工具箱(详见toolbox),每个图表最多仅有一个工具箱
{Object} tooltip 提示框(详见tooltip),鼠标悬浮交互时的信息提示
{Object} legend 图例(详见legend),每个图表最多仅有一个图例,混搭图表共享
{Object} dataRange 值域选择(详见dataRange),值域范围
{Object} dataZoom 数据区域缩放(详见dataZoom),数据展现范围选择
{Object} roamController 漫游缩放组件(详见roamController),搭配地图使用
{Object} grid 直角坐标系内绘图网格(详见grid
{Array | Object} xAxis 直角坐标系中横轴数组(详见xAxis),数组中每一项代表一条横轴坐标轴,标准(1.0)中规定最多同时存在2条横轴
{Array | Object} yAxis 直角坐标系中纵轴数组(详见yAxis),数组中每一项代表一条纵轴坐标轴,标准(1.0)中规定最多同时存在2条纵轴
{Array} series 驱动图表生成的数据内容(详见series),数组中每一项代表一个系列的特殊选项及数据
怀有希望!!
分享到:
评论

相关推荐

    echarts.js图表插件带坐标点和放大缩小地图

    ECharts.js是一款由百度开发的开源JavaScript数据可视化库,它提供了丰富的图表类型,适用于各种Web应用中的数据展示。"echarts.js图表地图"是ECharts的一个重要特性,它能够帮助开发者创建具有交互性的地理信息图表...

    06-Echarts简化系列之:极坐标系的 radiusAxis径向轴和 angleAxis角度轴

    Echarts 极坐标系 角度轴 option 配置代码

    ECharts 下载 版本:4.2.1-rc.3

    1. 性能优化:ECharts团队持续对渲染性能进行优化,确保在大数据量时仍能流畅运行。 2. 新增图表类型:可能增加了新的图表类型,以满足更多样化的展示需求。 3. API和配置项更新:可能会有一些API的调整或者新增,以...

    echarts5.4.3.min.js.7z

    1. 性能优化:ECharts 一直在追求更好的渲染性能,5.4.3 版本可能会有进一步的渲染速度提升,尤其在大数据量或者复杂图表场景下。 2. 新图表类型:ECharts 可能会引入新的图表类型以满足更多需求,比如热力图、树图...

    echarts3地图数据GeoJson(全国、省、地市)

    6. 渲染图表:调用 `myChart.setOption(option)`,其中 `myChart` 是 ECharts 实例,`option` 是配置项对象。 在 ECharts 3 中,由于地图数据不再内置,开发者需要自行获取并加载 GeoJSON 数据。这增加了灵活性,但...

    echarts水球图插件2.0.6

    4. **配置项详解**:ECharts水球图插件的配置项包括`backgroundColor`(背景颜色)、`color`(液体颜色)、`gaugeLineWidth`(刻度线宽度)、`data`(数据数组,用于表示液体填充的程度)等。其中,`data`中的每个...

    echarts-liquidfill.js水球图

    3. **事件监听**:ECharts 提供了丰富的事件监听机制,可以监听水球图的点击、鼠标悬浮等事件,实现交互式功能。 4. **实时更新**:你可以动态更新数据,水球图会自动根据新的数据值进行重绘。 **四、应用场景** ...

    echarts的option

    echarts的option

    echarts地图(省份JSON版)

    7. **加载数据并渲染**:将`option`对象传递给ECharts实例的`setOption`方法,完成地图的绘制。 示例代码可能如下: ```javascript var myChart = echarts.init(document.getElementById('main')); var option = {...

    taro 使用echarts图表.zip

    在本文中,我们将深入探讨如何在Taro框架中有效地使用ECharts图表库。Taro是一个开源的跨端框架,允许开发者编写一次代码,部署到多个平台,如微信小程序、H5、React Native等。ECharts则是一个优秀的JavaScript数据...

    echarts 3D地图,地图区域点击触发事件

    总结,ECharts 3D地图提供了一种强大且灵活的方式来展示地理数据,通过设置地图类型、监听点击事件以及添加数据,我们可以创建出具有交互性的3D地图。结合HTML、CSS和JavaScript的技能,开发者可以打造出各种复杂的...

    问一个关于echarts本地路径的问题

    3. **图片路径**:ECharts的一些组件,如地图,可能需要引用本地的图片资源。同样,确保图片文件路径正确,比如: ```javascript var option = { geo: { ... mapJson: { ... imgUrl: 'img/map.png' } } };...

    echarts江苏地图实例

    总的来说,ECharts江苏地图实例是一个很好的学习案例,它展示了如何使用ECharts的特性来创建具有互动性和可视化的地理信息图表。通过深入理解这个实例,开发者可以进一步掌握ECharts的使用,为数据分析和展示提供...

    echarts 图表

    1. **多样化图表**:ECharts 支持多种图表类型,包括折线图、柱状图、饼图、散点图、地图、仪表盘等,满足各种数据分析展示需求。 2. **交互性**:ECharts 提供了丰富的交互功能,如缩放、平移、刷选、悬停显示详情...

    Echarts:基础折线图(含异步加载数据)

    5. 使用ECharts实例加载配置:调用`myChart.setOption`方法,其中`myChart`是初始化得到的ECharts实例,`option`是配置项。 接下来,我们谈谈如何实现异步加载数据。在某些情况下,数据可能来自服务器,不能一次性...

    ECharts简单样例

    1. **丰富的图表类型**:ECharts支持折线图、柱状图、饼图、散点图、地图、仪表盘等多种图表,同时提供自定义图表功能,满足不同场景的需求。 2. **跨平台与浏览器兼容**:ECharts是基于HTML5 Canvas的,因此能在...

    ECharts学习代码

    下面我们将深入探讨ECharts的学习要点。 首先,**安装与引入**。ECharts可以通过npm或CDN方式引入到项目中。如果使用npm,可以运行`npm install echarts --save`,然后在代码中用`import echarts from 'echarts'`...

    echarts超级炫酷3d地球

    5. **交互功能**:ECharts支持鼠标和触摸事件,可以添加交互功能,如双击停止/开启旋转,鼠标悬停时显示信息等。这些功能需要在配置项中设置。 6. **更新和响应式设计**:ECharts提供了API,允许我们在运行时动态...

    Js正太分布图源码,echarts单页面实现

    总结起来,通过结合JavaScript、ECharts和Vue.js,我们可以创建一个功能完备的单页面应用,用于显示和分析正态分布图。这不仅有助于理解正态分布的特性,还能够为数据分析和可视化提供直观的工具。在实际项目中,...

Global site tag (gtag.js) - Google Analytics