Echarts饼图百分比算法利用Java实现

问题：在开发中有这样的问题，就是需要在其他地方展示百分比，但是自己计算的百分比通过四舍五入后，与饼图里面的百分比不一致的问题，要想解决这个问题，那么必须要使用echarts源码中的计算方式。当存在四舍五入的时候,Echarts的百分比算法和自己写的百分比算法不同,导致相加后不等于100%.

如下图：数据不一致的问题

百分比算法源码地址：https://github.com/apache/echarts/blob/HEAD/src/util/number.ts

Java方式解决：

public class DemoTest {/*** 数组** @param arr       数组* @param sum       总数* @param idx       索引* @param precision 精度*/public static double getPercentValue(int[] arr, double sum, int idx, int precision) {if ((arr.length - 1) < idx) {return 0;}//求和if (sum <= 0) {for (int j : arr) {sum += j;}}//10的2次幂是100，用于计算精度。double digits = Math.pow(10, precision);//扩大比例100double[] votesPerQuota = new double[arr.length];for (int i = 0; i < arr.length; i++) {double val = arr[i] / sum * digits * 100;votesPerQuota[i] = val;}//总数,扩大比例意味的总数要扩大double targetSeats = digits * 100;//再向下取值，组成数组double[] seats = new double[arr.length];for (int i = 0; i < votesPerQuota.length; i++) {seats[i] = Math.floor(votesPerQuota[i]);}//再新计算合计，用于判断与总数量是否相同,相同则占比会100%double currentSum = 0;for (double seat : seats) {currentSum += seat;}//余数部分的数组:原先数组减去向下取值的数组,得到余数部分的数组double[] remainder = new double[arr.length];for (int i = 0; i < seats.length; i++) {remainder[i] = votesPerQuota[i] - seats[i];}while (currentSum < targetSeats) {double max = 0;int maxId = 0;int len = 0;for (int i = 0; i < remainder.length; ++i) {if (remainder[i] > max) {max = remainder[i];maxId = i;}}//对最大项余额加1++seats[maxId];//已经增加最大余数加1,则下次判断就可以不需要再判断这个余额数。remainder[maxId] = 0;//总的也要加1,为了判断是否总数是否相同,跳出循环。++currentSum;}// 这时候的seats就会总数占比会100%return seats[idx] / digits;}public static void main(String[] args) {int[] arr = new int[]{12, 1, 1, 1, 1, 1, 1};for (int i = 0; i < arr.length; i++) {System.out.println("值:" + getPercentValue(arr, 18, i, 2));}}
}

结果如下：

开发中从后端计算好即可解决问题。如下

文章参考：https://blog.csdn.net/qq_16438883/article/details/102953597

Echarts饼图百分比算法利用Java实现相关推荐

echarts饼图百分比不为100%
一.问题由于需要兼容低版本ie,使用的echarts版本较低,为2.2.x.当前版本有饼图百分比不为100%的问题,如数据为如下: [ { name: '测试1', value: 1 }, { na ...
echarts饼图百分比的直接展示
引用echart的版本不一样,写法也存在差异 <div id="wraper" style="width: 1100px;height: 500px;backgro ...
Echarts 扇形百分比算法(最大余额法)
//valueList 总数组 //index 需要被计算的数组的下标 //precision 几位小数 getPercentValue: function(valueList, index, pre ...
java最大余数法(百分比算法Echarts)
最近工作中使用Echarts开发报表的时候遇到了这样的一个问题,需求是一个div中左边是一个环形图表,右边是一个表格,表格中展示图表中每个类别占用的百分比. 存在的问题: 1.当存在四舍五入的时候,E ...
echarts 饼图效果，显示其对应数值及百分比
需求:echarts 饼图效果,显示其对应数值及百分比代码 <Chart1 :ecStyle="ecStyle" :ecOption="optionRight2& ...
Echarts饼图显示数值和百分比
Echarts 饼图显示名称,数值和百分比核心: series : [ {name:'',type : 'pie',radius : '65%',center : [ '50%', '50%' ], ...
echarts饼图显示占比(内部和外部显示百分比设置)
1.效果图: 2.代码: series: [{name: '产量',type: 'pie',center: ['22%', '50%'],radius: ['0', '82%'],avoidLabel ...
解决echarts饼图显示百分比，和显示内容字体及大小,如何给eCharts饼图区域指定颜色
解决echarts饼图显示百分比,和显示内容字体及大小 // 基于准备好的dom,初始化echarts实例 var pieEchart = echarts.init(document. ...
floyd算法java_利用JAVA和Floyd算法实现上海地铁最短路线搜索系统
[实例简介] Floyd算法基于JAVA实现上海地铁最短路线搜索系统,图形界面,支持新建删除站点以及新建线路. [实例截图] [核心代码] SUBWAY └── SUBWAY ├── bin │ ...

Echarts饼图百分比算法利用Java实现

Echarts饼图百分比算法利用Java实现相关推荐

最新文章

热门文章