' + params[0].name + '

'; for (var i = 0; i < params.length; i++) { str = '' + params[0].name + '
  30人及以下：'+getvalue[params[i].dataIndex]+'门
  31-60人：'+getvalue1[params[i].dataIndex]+'门
  61-90人：'+getvalue2[params[i].dataIndex]+'门
  90人以上：'+getvalue3[params[i].dataIndex]+'门'; } return str; } }, color:['#0A79DF','#F7CB6B','#61E9C1','#A48FFF'], legend: { type: "scroll", right: '10', top: '0', data: ['30人及以下', '31-60人', '61-90人', '90人以上'], itemGap: 25, itemWidth: 16, itemHeight: 16, textStyle: { fontSize: '13', color: '#666666', }, }, xAxis: [{ data: getname, axisLabel: { //interval: 0, formatter: function(value) { var ret = ""; //拼接加\n返回的类目项 var maxLength = 4; //每项显示文字个数 var valLength = value.length; //X轴类目项的文字个数 var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数 if (rowN > 1) //如果类目项的文字大于4, { for (var i = 0; i < rowN; i++) { var temp = ""; //每次截取的字符串 var start = i * maxLength; //开始截取的位置 var end = start + maxLength; //结束截取的位置 //这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧 temp = value.substring(start, end) + "\n"; ret += temp; //凭借最终的字符串 } return ret; } else { return value; } }, margin: 10, color: '#666666', textStyle: { fontSize: 13 }, }, axisLine: { lineStyle: { color: '#B0C5DB', } }, axisTick: { show: false }, }], yAxis: [{ name: '门', nameTextStyle: { color: '#999999', fontSize: 13, padding: [0, 0, 0, 65] }, axisLabel: { color: '#666666', textStyle: { fontSize: 13 }, }, axisLine: { show: false }, axisTick: { show: false }, splitLine: { lineStyle: { color: '#CCDBEB', type: 'dashed', opacity: 0.5 } } }], series: [{ name:'30人及以下', stack:'30人及以下', type: 'bar', data: getvalue, barWidth: '20px', itemStyle: { normal: { color: function(params) { return colorFirst }, barBorderRadius: [0, 0, 9, 9], } }, },{ name:'30人及以下', stack:'30人及以下', type: "pictorialBar", symbolSize: [20, 15], //调整截面形状 symbolOffset: [-39, -7.5], z: 12, symbolPosition: "end", itemStyle: { normal: { color: function(params) { return colorFirst1 }, label: { show: false, } }, }, data: getvalue },{ name:'30人及以下', stack:'30人及以下', type: "pictorialBar", symbolSize: [20, 15], //调整截面形状 symbolOffset: [-39, -7.5], z: -1, symbolPosition: "end", itemStyle: { normal: { color: function(params) { return colorFirst2 } }, }, data: getvalue },//第一系列 { name:'31-60人', stack:'31-60人', type: 'bar', data: getvalue1, barWidth: '20px', itemStyle: { normal: { color: function(params) { return colorSecond }, barBorderRadius: [0, 0, 9, 9], } }, },{ name:'31-60人', stack:'31-60人', type: "pictorialBar", symbolSize: [20, 15], //调整截面形状 symbolOffset: [-13, -7.5], z: 12, symbolPosition: "end", itemStyle: { normal: { color: function(params) { return colorSecond1 }, label: { show: false, } }, }, data: getvalue1 },{ name:'31-60人', stack:'31-60人', type: "pictorialBar", symbolSize: [20, 15], //调整截面形状 symbolOffset: [-13, -7.5], z: -1, symbolPosition: "end", itemStyle: { normal: { color: function(params) { return colorSecond2 } }, }, data: getvalue1 },//第二系列 { name:'61-90人', stack:'61-90人', type: 'bar', data: getvalue2, barWidth: '20px', itemStyle: { normal: { color: function(params) { return colorThird }, barBorderRadius: [0, 0, 9, 9], } }, },{ name:'61-90人', stack:'61-90人', type: "pictorialBar", symbolSize: [20, 15], //调整截面形状 symbolOffset: [13, -7.5], z: 12, symbolPosition: "end", itemStyle: { normal: { color: function(params) { return colorThird1 }, label: { show: false, } }, }, data: getvalue2 },{ name:'61-90人', stack:'61-90人', type: "pictorialBar", symbolSize: [20, 15], //调整截面形状 symbolOffset: [13, -7.5], z: -1, symbolPosition: "end", itemStyle: { normal: { color: function(params) { return colorThird2 } }, }, data: getvalue2 },//第三系列 { name:'90人以上', stack:'90人以上', type: 'bar', data: getvalue3, barWidth: '20px', itemStyle: { normal: { color: function(params) { return colorForth }, barBorderRadius: [0, 0, 9, 9], } }, },{ name:'90人以上', stack:'90人以上', type: "pictorialBar", symbolSize: [20, 15], //调整截面形状 symbolOffset: [39, -7.5], z: 12, symbolPosition: "end", itemStyle: { normal: { color: function(params) { return colorForth1 }, label: { show: false, } }, }, data: getvalue3 },{ name:'90人以上', stack:'90人以上', type: "pictorialBar", symbolSize: [20, 15], //调整截面形状 symbolOffset: [39, -7.5], z: -1, symbolPosition: "end", itemStyle: { normal: { color: function(params) { return colorForth2 } }, }, data: getvalue3 }//第四系列 ] };

Echarts在线免费图表