作者:empty 页数:111 出版社:empty |
上面提到诸如‘legend select changed'事件会由组件交互的行为触发, 那除了用户的交互操作, 有时候也会有需要在程序里调用方法触发图表的行为, 诸如显示tooltip, 选中图例。在E Charts 2.x是通过myChart.component.tooltip.show Tip这种形式调用相应的接口触发图表行为, 入口很深, 而且涉及到内部组件的组织。相对地, 在E Charts 3里改为通过调用my Chart.dispatch Action({type:''} )触发图表行为,统一管理了所有动作,也可以方便地根据需要去记录用户的行为路径。
本文主要是大略概述,用哪些方法,可以设置设置样式,改变图形元素或者文字的颜色、明暗、大小等。之所以用 样式 这种可能不很符合数据可视化思维的词,是因为,比较通俗易懂,本文介绍这几种方式,他们的功能范畴可能会有交叉(即同一种细节的效果可能可以用不同的方式实现),但是他们各有各的场景偏好。·颜色主题(Theme)·调色盘·直接样式设置(item Style、linestyle、area Style、label、..)·视觉映射(visual Map) 其他关于样式的文章, 参见:个性化图表的样式, 数据的视觉映射。颜色主题(Theme)最简单的更改全局样式的方式, 是直接采用颜色主题(theme) 。例如, 在示例集合中, 可以选择“Theme , 直接看到采用主题的效果。
下面我们来看如何使用E Charts实现下面这个南丁格尔图:·https://echarts,baidu.com/gallery/view.html?c=doc-example/tutorial-·https://echarts.baidu.com/gallery/view.html?c=doc-example/tutorial-5分钟上手E Charts中讲了如何绘制一个简单的柱状图, 这次要画的是饼图, 饼图主要是通过扇形的弧度表现不同类目的数据在总和中的占比,它的数据格式比柱状图更简单,只有一维的数值,不需要给类目。因为不在直角坐标系上, 所以也不需要xAxis,yAxis。c=doc-example/tutorial-styling-step a&edit=1&reset= 1这里data属性值不像入门教程里那样每一项都是单个数值, 而是一个包含name和value属性的对象, E Charts中的数据项都是既可以只设成数值, 也可以设成一个包含有名称、该数据图形E Charts中的饼图也支持通过设置rose Type显示成南丁格尔图。https://echarts.baidu.com/gallery/view.html?c=doc-example/tutorial-styling-E Charts中有一些通用的样式, 诸如阴影、透明度、颜色、边框颜色、边框宽度等, 这些样式一般都会在系列的item Style里设置。例如阴影的样式可以通过下面几个配置项设置:https://echarts.baidu.com/gallery/view.html?c=doc-example/tutorial-styling-item Style的emphasis是鼠标hover时候的高亮样式。这个示例里是正常的样式下加阴影,
目录
致谢
5分钟上手E Charts
E Charts中的事件和行为
E Charts中的样式简介
个性化图表的样式
使用Canvas或者5VG渲染
使用E Charts GL实现基础的三维可视化
使用dataset管理数据
在web pack中使用E Charts
在图表中加入交互组件
在图表中支持无障碍访问
在微信小程序中使用E Charts
富文本标签
小例子:实现日历图
小例子:自己实现拖拽
异步数据加载和更新
数据的视觉映射
旭日图
服务端渲染
移动端自适应
自定义构建E Charts
自定义系列
丰文档使用书秘(BookStack.CN) 构建
......