javascript - 将分数计算为相对于其他分数的值

Question

抱歉，我无法显示代码，我只是不确定如何解决这个问题。

我想实现类似于 display: flex/grid 对分数所做的事情:

给定容器宽度:200px

和项目:[0.5, 1, 50px]

我应该能够计算相对于彼此的小数:

item1: 50 (half the size of item 2)
item2: 100 (double the size of item 1)
item3: 50 (static size not a fraction)

const totalSize = 900;

const items = [1, 0.2, 75, 0.6, 1, 100];

const totalStaticSize = items.filter(n => n > 1).reduce((acc, n) => acc + n, 0);

const derivedItems = items.map(item => {
  if (item > 1) {
    // A static value.
    return item;
  }
  
  // How to calculate this fractional item relative to others?
  return item;
});

console.log(derivedItems);

Answer 1

减去静态项后，计算小数项的总和，然后就可以计算每个值相对于剩余容器宽度的百分比(减去静态项总和):

const totalSize = 900;
const items = [1, 0.2, 75, 0.6, 1, 100];
const totalStaticSize = items.filter(n => n > 1).reduce((acc, n) => acc + n, 0);
const sum = derivedItems.reduce((a, b) => a + b, 0);
const percentages = derivedItems.map(d => d / sum);
const relativeToContainer = percentages.map(p => p * (totalSize - totalStaticSize));