计算直方图图形列的高度

时间:2015-12-17 19:53:21

标签: javascript graphics histogram calculated-columns histogram2d

我无法找出在直方图图形中计算柱子高度的最简单的公式。

例如,我有一个数据数组

var data = [82, 61, 88, 245, 201, 619, 735, 1099, 1088, 1477, 1531, 1717, 1263, 1674, 1254, 1134, 718, 887, 748, 569, 485, 565, 286, 266, 298, 203, 171, 235, 128, 127, 109, 128, 76, 73, 73, 85, 44, 33, 47, 29, 38, 47, 35, 31, 16, 17, 11, 20, 20, 276]

这是数字列表(数组中的每个数字表示更接近0到3000范围边缘的属性数)。我需要最大柱高为30px。我应该做什么样的计算?

example of result

我想我的伪代码应如下所示:

var maxPropertiesNumber = Math.max.apply(null, data);
var html = list.map(column => {
   var style = {
     width: 10px,
     backgroundColor: 'grey',
     height: ...
   };
   return <div style={style}></div>
})

1 个答案:

答案 0 :(得分:1)

  1. 查找数组中的最大值。
  2. 计算:30px /(最大值)=每单位像素数
  3. 循环显示值并执行计算:round(value *         像素每单位)