echarts的legend |
您所在的位置:网站首页 › echarts地图图例圆点 › echarts的legend |
🙂博主:小猫娃来啦 🙂文章核心:echarts的legend——图例样式的配置 文章目录 认识图例 从echarts官网开始了解 Legend的作用 配置Legend 图例类型 事件与交互 使用示例和Demo 真实项目中legend的配置 重点 关于legend的所有配置项列表 认识图例以下是真实项目中的图表展示以及echarts官网的图表,先看看到底什么是图例
echarts图表中的图例,有形状,颜色,位置等等各种样式的不同配置。 从echarts官网开始了解echarts官网配置项手册里有非常详细的内容,我们挑几种常用的看看,加深对legend属性的理解 show: 是否显示图例,默认值为true。 type: 图例的类型,可选值有: 'plain':普通图例,适用于数据较少时;'scroll':滚动图例,适用于大量数据的展示;'paging':翻页图例,适用于大量数据的展示。textStyle: 图例文本的样式配置项。 color: 图例文本的颜色,默认为'#333'。fontStyle: 图例文本的字体风格,如'normal'、'italic'、'oblique'。fontWeight: 图例文本的字体粗细,如'normal'、'bold'、'bolder'、'lighter'。fontSize: 图例文本的字体大小,默认为12。fontFamily: 图例文本的字体系列。data: 图例的数据数组,每一项对应一个系列的名称。可以通过在data中设置特殊字符来实现自定义图例标记。 formatter: 图例文本的格式化函数,用于自定义图例文本的显示方式。 selected: 图例的初始选中状态,可以通过配置该项来设置哪些系列初始时显示,哪些系列初始时隐藏。 inactiveColor: 未选中图例项的颜色,默认为'#ccc'。 selectedMode: 图例选择的模式,可选值有: 'single':单选模式,同一时刻只能选择一个图例项;'multiple':多选模式,可以同时选择多个图例项。align: 图例的水平对齐方式,默认为'auto'。 'auto':自动根据图表位置进行对齐;'left':左对齐;'right':右对齐。verticalAlign: 图例的垂直对齐方式,默认为'auto'。 'auto':自动根据图表位置进行对齐;'top':上对齐;'bottom':下对齐。layout: 图例的布局方式,可选值有: 'horizontal':水平布局,默认;'vertical':垂直布局。itemWidth: 图例标记的宽度,默认为25。 itemHeight: 图例标记的高度,默认为14。 itemGap: 图例项之间的间距,默认为10。 pageButtonItemGap: 滚动图例翻页按钮与图例项之间的间距,默认为5。 pageButtonGap: 滚动图例翻页按钮之间的间距,默认为0。 pageTextStyle: 滚动图例中页信息的样式配置项。 animationDurationUpdate: 图例切换时的动画时长,默认为300毫秒。 |
今日新闻 |
推荐新闻 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |