javascript - 计算直方图图形列高

标签 javascript graphics histogram calculated-columns histogram2d

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

例如,我有一个数据数组

var 数据 = [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. 查找数组中的最大值。
  2. 计算:30px/(最大值)= 每单位像素
  3. 循环遍历值并执行计算:round(value * 每单位像素)

关于javascript - 计算直方图图形列高,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34343138/

相关文章:

javascript - 将文本从大写形式转换为 div 内的大写形式

c - 多边形不会出现在屏幕上

java - 缓冲图像动画代码无法正确重画

c++ - 尝试在没有 opencv calcHist() 的情况下计算我自己的直方图

gnuplot - 带有 histeps 的直方图连接条

javascript - YUI getElementById ('id' ).value 已弃用?

javascript - 使用 Jquery 和 Ajax 根据组合框中选定的值自动填充表单

javascript - 这两种 JavaScript 模式有什么区别

java - JTable 1点边框不出现在网格线上

随机分布数据的Matlab直方图