echarts的legend图例的显示与隐藏(legend图例进入页面显示的个数)
来源:互联网 发布:c语言 gbk转unicode 编辑:程序博客网 时间:2024/05/04 16:37
在操作echarts时,echarts的柱状图、地图等各种图形显示的时候往往会有legend图标的显示,有时候需求要求,legend图标不全部显示,只显示一个或指定的图标显示。
默认的图形(以柱状图及地图为例):
需求要求的图:
解决办法:
代码展示:
默认的图形(以柱状图及地图为例):
需求要求的图:
解决办法:
代码展示:
function randomData() { return Math.round(Math.random()*1000);}option = { title: { text: 'iphone销量', subtext: '纯属虚构', left: 'center' }, tooltip: { trigger: 'item' }, legend: { orient: 'vertical', left: 'left', data:['iphone3','iphone4','iphone5'], selected: { 'iphone3' : false, 'iphone5' : false, //不想显示的都设置成false } }, visualMap: { min: 0, max: 2500, left: 'left', top: 'bottom', text: ['高','低'], // 文本,默认为数值文本 calculable: true }, toolbox: { show: true, orient: 'vertical', left: 'right', top: 'center', feature: { dataView: {readOnly: false}, restore: {}, saveAsImage: {} } }, series: [ { name: 'iphone3', type: 'map', mapType: 'china', roam: false, label: { normal: { show: true }, emphasis: { show: true } }, data:[ {name: '北京',value: randomData() }, {name: '天津',value: randomData() }, {name: '上海',value: randomData() }, {name: '重庆',value: randomData() }, {name: '河北',value: randomData() }, {name: '河南',value: randomData() }, {name: '云南',value: randomData() }, {name: '辽宁',value: randomData() }, {name: '黑龙江',value: randomData() }, {name: '湖南',value: randomData() }, {name: '安徽',value: randomData() }, {name: '山东',value: randomData() }, {name: '新疆',value: randomData() }, {name: '江苏',value: randomData() }, {name: '浙江',value: randomData() }, {name: '江西',value: randomData() }, {name: '湖北',value: randomData() }, {name: '广西',value: randomData() }, {name: '甘肃',value: randomData() }, {name: '山西',value: randomData() }, {name: '内蒙古',value: randomData() }, {name: '陕西',value: randomData() }, {name: '吉林',value: randomData() }, {name: '福建',value: randomData() }, {name: '贵州',value: randomData() }, {name: '广东',value: randomData() }, {name: '青海',value: randomData() }, {name: '西藏',value: randomData() }, {name: '四川',value: randomData() }, {name: '宁夏',value: randomData() }, {name: '海南',value: randomData() }, {name: '台湾',value: randomData() }, {name: '香港',value: randomData() }, {name: '澳门',value: randomData() } ] }, { name: 'iphone4', type: 'map', mapType: 'china', label: { normal: { show: true }, emphasis: { show: true } }, data:[ {name: '北京',value: randomData() }, {name: '天津',value: randomData() }, {name: '上海',value: randomData() }, {name: '重庆',value: randomData() }, {name: '河北',value: randomData() }, {name: '安徽',value: randomData() }, {name: '新疆',value: randomData() }, {name: '浙江',value: randomData() }, {name: '江西',value: randomData() }, {name: '山西',value: randomData() }, {name: '内蒙古',value: randomData() }, {name: '吉林',value: randomData() }, {name: '福建',value: randomData() }, {name: '广东',value: randomData() }, {name: '西藏',value: randomData() }, {name: '四川',value: randomData() }, {name: '宁夏',value: randomData() }, {name: '香港',value: randomData() }, {name: '澳门',value: randomData() } ] }, { name: 'iphone5', type: 'map', mapType: 'china', label: { normal: { show: true }, emphasis: { show: true } }, data:[ {name: '北京',value: randomData() }, {name: '天津',value: randomData() }, {name: '上海',value: randomData() }, {name: '广东',value: randomData() }, {name: '台湾',value: randomData() }, {name: '香港',value: randomData() }, {name: '澳门',value: randomData() } ] } ]};
0 0
- echarts的legend图例的显示与隐藏(legend图例进入页面显示的个数)
- 显示图例(legend)
- ggplot2--legend图例的修改
- ggplot2--legend图例的修改
- echarts之legend-改变图例的图标为自定义图片
- echarts之legend-改变图例的图标为自定义图片
- [Ext JS 4] Extjs 图表 Legend(图例)的分行与分列显示
- echarts 修改图例legend颜色
- legend图例
- QCustomPlot的legend图例背景透明的方法
- Echarts中legend图例太多与title重叠问题
- highcharts控制图标的图例legend不允许切换
- Arcgis for Silverlight的图例Legend默认折叠
- matplotlib的基本用法(四)——设置legend图例
- Echarts图例legend过多,采用翻页处理
- 十一、基础教程-图例(Legend)
- echarts图例显示不全以及颜色的一些问题
- ggplot2--Legend(图例操作)
- 使用codeblocks编程运行时终端不能复制粘贴
- 【12月7日】类的初始化(二):构造器初始化
- MySQL5.7 binlog_group_commit_sync_delay对并发复制性能的影响
- Codeforces Round #383 (Div. 2) A(快速幂取膜)
- BZOJ4711: 小奇挖矿
- echarts的legend图例的显示与隐藏(legend图例进入页面显示的个数)
- 快速增加微信好友技巧
- PullToRefresh下拉刷新 加载更多 详解 +示例
- 2016-12-7 新版筛选法求素数
- CSS3 的 transition 和 animation
- RxJava—操作符(过滤、合并、转换)
- 关于同网段内主机之间通信细节
- Linux常用快捷键
- Linux网络编程面试--tcp和udp的区别