js 数组值同比例缩小

js yekong

three 3d饼状图渲染的时候,如果数据太大会导致饼状图渲染变形,这时候我们需要对数据进行处理,让数据处在某个范围内

let data = [
      {
        value: 1225,
        name: "标准护理",
        color1: '#016fec',
        color2: '#0052da',
      },
      {
        value: 1000,
        name: "中度护理",
        color1: '#2ed9ff',
        color2: '#00cdd7',
      },
      {
        value: 1100,
        name: "重度护理",
        color1: '#ffa821',
        color2: '#ffd587',
      },
      {
        value: 1000,
        name: "其他护理",
        color1: '#ffdd4e',
        color2: '#fff079',
      },
    ]; 

如果您想将data数组中的value字段同比例缩小,使其最大值为10,您可以首先找到数组中的最大值,然后计算缩放因子,并使用该因子来缩放每个value

以下是如何实现的:

// 获取数组中的最大值
let maxValue = Math.max(...data.map(item => item.value));

// 计算缩放因子
let scale = 10 / maxValue;

// 使用缩放因子来缩放每个value
data.forEach(item => {
    item.value = item.value * scale;
});

console.log(data);

此代码将首先找到data数组中的最大值,然后计算必要的缩放因子,最后使用该因子来缩放每个value,从而确保最大值为10。

我们将处理后的数据传值给3d饼状图,就可以保证饼状图不会因为数据值太大而导致饼状图变形了。

喜欢