echart柱状图堆列实现百分比显示

let xAxisValue1 = [63, 89, 44, 34, 3, 98];
let xAxisValue2 = [23, 89, 44, 34, 3, 98];
option = {legend: {data: ['退出项目', '未退出项目'],bottom: 0},title: {text: '已退出项目占比',x: 'center',textAlign: 'center'},toolbox: {},color: ['rgb(116,142,222)', '#AD6D69'],tooltip: {},xAxis: {data: ['赛用业务线','赛用业务线','赛用业务线','赛用业务线','赛用业务线','赛用业务线'],axisLine: { show: false },splitLine: { show: false },splitArea: { show: false },axisTick: { show: false }},yAxis: {splitLine: { show: false },axisLabel: { show: false }},grid: {bottom: 100},series: [{name: '退出项目',type: 'bar',stack: 'one',data: xAxisValue1,label: {show: true,color: '#fff',formatter: function (a) {return a.data;}},},{name: '未退出项目',type: 'bar',stack: 'one',data: xAxisValue2,label: {show: true,color: '#fff',formatter: function (a) {return a.data;}},markPoint: {symbolSize: 0,data: formatterMake(xAxisValue1,xAxisValue2),label: {show: true,position: 'top',color: '#333',}}}]
};
function formatterMake(v1,v2) {var arr = new Array();v1.map(function (item, i) {arr.push({coord: [i, v1[i]+v2[i]],value: Math.round(v1[i]/(v1[i]+v2[i])*100)+'%'});});return arr;
}

echart柱状图堆列实现百分比显示相关推荐

R语言ggplot2可视化百分比显示实战：纵轴显示为百分比、在柱状图上显示百分比、按照因子变量绘制分组子图（纵轴显示为百分比）、可视化图中显示数据百分比
R语言ggplot2可视化百分比显示实战:纵轴显示为百分比.在柱状图上显示百分比.按照因子变量绘制分组子图(纵轴显示为百分比).可视化图中显示数据百分比目录
关于使用echarts堆叠柱状图百分比显示的问题
关于使用echarts堆叠柱状图百分比显示的问题平常工作没有涉及到echarts,所以平常也没有去关注图表这一块,然后碰到一个需求,要求使用堆叠柱状图,但是数值是需要百分比显示的,不是在所获取到的数 ...
echart柱状图Y轴最小间隔问题,Y轴不显示小数
今天来说说echart 柱状图 Y轴的最小值.间隔问题. 最近项目中用到柱状图,数据量少的时候,Y轴会出现小数,但是我们产品小哥哥说不能出现小数,好了,那就开干! option = {xAxis: { ...
echart 柱状图横坐标文字过长，如何旋转
echart 柱状图横坐标文字过长,如何旋转有时候,在用柱状图表的时候,如果横坐标文字过长,某些文字就会消失不显示,我们可以将其旋转一下,调整到合适的角度,就能正常显示横坐标文字了. 比如下面这样, ...
pandas使用pct_change计算数据列的百分比变化、环比变化率：计算当前元素和前一个元素之间的百分比变化、使用style函数指定format的格式：百分比、缺失值替换、用颜色标注极大值和极小值
pandas使用pct_change计算数据列的百分比变化.环比变化率:计算当前元素和前一个元素之间的百分比变化.使用style函数指定format的格式:百分比.缺失值替换.用颜色标注极大值和极小值 ...
SQL Server表竖列转横向显示
----------联合查询结果集存入临时表 select * into ##tmpa from (select wh_WhName,sum(ps_DiscountMoney) as moneys,p ...
easyui datagrid 列隐藏和显示
easyui datagrid 列隐藏和显示用js怎么控制列的显示和隐藏? 最佳答案 $('#grid').datagrid('hideColumn','列field');把hideColumn换成 ...
div显示图片_图片按照百分比显示部分，不变形
本篇主要介绍一些按照百分比来截取显示一部分图片, 采用css+div来定义,我自己试过一个做背景,一个图片,然后百分比显示图片但是这种方式图片变形,所以现在这种方式是两个都采用背景,上面的一个百分比显 ...
mysql查询结果百分比表示_MySQL 查询结果以百分比显示简单实现
用到了MySQL字符串处理中的两个函数concat()和left()实现查询结果以百分比显示,具体示例代码如下,感兴趣的朋友可以学习下找了一些资料,然后我是用到了MySQL字符串处理中的两个函数co ...
锂电池电量百分比计算_手机电池容量的百分比显示跟电池的电量“格子”的比例计算...
某些机型(如936,S1200,8288包括以前的818,838等老战斗机)的容量显示又有点不合常规,以S1200为例,他的容量格子定义如下: 4.20V~3.76V----4格 3.76V~3.72 ...

echart柱状图堆列实现百分比显示

echart柱状图堆列实现百分比显示相关推荐

最新文章

热门文章