您好,欢迎访问本站博客! 控制台  查看权限
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏吧
  • 网站所有资源均来自网络,如有侵权请联系站长删除!

Echarts 分组, Echart X/Y轴 分组, Echart 分组实现

默认分类 Sena 2019-11-29 159 次浏览 0个评论

image.png


		myChart.setOption(option = {
			title : {
				text : '净资产收益率(%)',
				x : 'center'
			},
			color : [ '#3e6591', '#eb7d22', '#d73f45' ],
			tooltip : {
				trigger : 'axis',
				axisPointer : { // 坐标轴指示器,坐标轴触发有效
					type : 'shadow' // 默认为直线,可选为:'line' | 'shadow'
				}
			},
			grid : {
				left : 250
			},
			xAxis : {
				axisLine : {
					lineStyle : {
						color : '#ccc'
					}
				},
				axisLabel : {
					textStyle : {
						color : '#777'
					}
				}
			},
			yAxis : [ {
				type : 'category',
				inverse : true,
				splitLine : {
					show : true
				},
				axisTick : {
					length : 100,
					lineStyle : {
						color : '#ccc'
					}
				},
				data : [ '最近第1年', '最近第2年', '最近第3年', '最近第1年', '最近第2年', '最近第3年', '最近第1年', '最近第2年', '最近第3年', '最近第1年', '最近第2年', '最近第3年' ]
			}, {
				nameLocation : 'start',
				nameTextStyle : {
					fontWeight : 'bold'
				},
				position : 'left',
				offset : 220,
				axisLine : {
					onZero : false,
					show : false
				},
				axisTick : {
					length : 100,
					inside : true,
					lineStyle : {
						color : '#ccc'
					}
				},
				axisLabel : {
					inside : true
				},
				inverse : true,
				data : [ '国网', '唯捷城配', '快狗速运', '驹马配送' ]
			} ],
			series : [ {
				name : "武侯",
				type : 'bar',
				data : [ 10, 9, 8, 2, 1, 1, 2, 1, 1, 2, 1, 1 ],
				label : {
					normal : {
						show : true,
						position : 'right',
						textStyle : {
							color : '#008000'
						}
					}
				}
			}, {
				name : "锦江",
				type : 'bar',
				data : [ 10, 9, 8, 2, 1, 1, 2, 1, 1, 2, 1, 1 ],
				label : {
					normal : {
						show : true,
						position : 'right',
						textStyle : {
							color : '#FFA500'
						}
					}
				}
			} ]
		});

已有 159 位网友参与,快来吐槽:

发表评论