javascript - 计算要填充的可用插槽数量
问题描述
想象一下,我有一个 4x5 的容器,里面有 20 个可用的插槽。在这个容器中,我有 13 个正方形和 7 个圆形:
但现在容器缩小到 3x3,只有 9 个可用插槽。
我想在这个较小的容器内显示相同的正方形与圆形的比例,每个容器的最后一个都是剩余的一堆物品。
现在,我将每种类型的项目的计数除以所有项目的总计数,以获得该类型占总计数的百分比值,然后将其乘以容器大小:
const percentage = typeCount / totalCount;
const spaceUnrounded = percentage * availableSlots;
所以这不是问题。当我需要将其四舍五入以获得正确数量的插槽时,问题就出现了。现在我正在寻找价值的底线:
const space = Math.floor(spaceUnrounded);
但这会导致项目留下 1 个空格。我还尝试找到第一种类型的值的上限,然后找到其余类型的下限:
const space = index === 0 ? Math.ceil(spaceUnrounded) : Math.floor(spaceUnrounded);
但这可能会导致项目增加 1 个额外的空间,具体取决于项目类型的数量。
Math.round
有同样的问题。
我可以在这里做什么?
编辑:我的预期输出可能是 6 个正方形和 3 个圆形,因为 13 是 20 的 65%,而 9 的 65% 是 5.85:
解决方案
选择您想要“权威”的数字(圆形或正方形,无关紧要),然后从插槽总数中减去该数字以获得另一个数字。
> slots = 20
> squares = 13
> circles = 7
> newslots = 9
> newsquares = Math.round(newslots/slots*squares)
6
> newcircles = newslots - newsquares
3
推荐阅读
- android - 无法在 Brida 中使用应用程序的类
- r - 在 dplyr 中结合使用 minimum 和 mutate 时如何处理重复项?
- security - 从 GPU 中提取数据
- javascript - 有没有一种好方法可以在跨事件发射器/事件循环边界的生产中显示错误跟踪?
- reactjs - 如何使用 Material UI 制作头像选择器
- angular - ng serve 找不到 node.js 核心模块
- servicestack - Servicestack - 将多个 POCO 映射到一个表的可能性
- javascript - 创建条形图后如何更改其背景颜色?
- python - 如何在 Python 中移动批量文件?
- processing - 使用 processing.sound.* 播放歌曲;