JavaScript 中的直方图?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/8195820/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Histogram in JavaScript?
提问by dani
I have this dataset for income:
我有这个收入数据集:
Income Number of people 0 245981 8.8 150444 30 126063 49.9 123519 70 115029 90.7 277149 109.1 355768 130 324246 150.3 353239 170.2 396008 190 396725 210 398640 230.1 401932 250 416079 270 412727 289.8 385192 309.7 343178 329.7 293707 349.6 239982 369.7 201557 389.3 165132 442.3 442075 543.4 196526 679.9 146784 883.9 48600 1555 44644
(As you can see, the width between income levels gets larger towards the end.)
(如您所见,收入水平之间的宽度在接近尾声时会变大。)
- How do I make an accurate histogram of this data in JavaScript? (On a linear x-axis scale with a range from for example 0 - 2000)
- How do I factor out the number of people to show only percentages at different intervals?
- If I'd like to place exactly 100 symbols representing the data, how do I decide where to place them?
- 如何在 JavaScript 中制作这些数据的准确直方图?(在线性 x 轴刻度上,范围从例如 0 - 2000)
- 如何分出人数以仅显示不同时间间隔的百分比?
- 如果我想准确地放置 100 个代表数据的符号,我该如何决定放置它们的位置?
回答by mbostock
The existing histogram examples are based on computing the histogramfrom samples, say if you had a list of individual people and their incomes. In this case, you already have the data for the histogram—you just want to display it.
现有的直方图示例基于从样本计算直方图,假设您有一个个人及其收入的列表。在这种情况下,您已经拥有直方图的数据——您只想显示它。
The tricky thing here is that your histogram has variable-width bins. The first thing you can do is ignore the variable-width of each bin and just display a simple lollipop chart. The x-axis is a linear scale for income, and the y-axis is a linear scale for count of people:
这里的棘手之处在于您的直方图具有可变宽度的 bin。您可以做的第一件事是忽略每个 bin 的可变宽度,只显示一个简单的棒棒糖图表。在X-轴是收入线性刻度,而ÿ-轴是为人类数线性刻度:
If you want to convert this to a histogram, you can't just replace those fixed-width lines with variable-width bars; you need to normalize the data so that the areaof the bar encodes the frequency of people with that income. Therefore, the width of the bar is the income range (such as from 0 to 8.8 for the first bin), and the height of the bar is the quantity of people divided by the width. As a result, the area (width × height) is proportional to the number of people. That looks like this:
如果要将其转换为直方图,则不能仅将那些固定宽度的线替换为可变宽度的条;您需要对数据进行归一化处理,以便条形图的区域对具有该收入的人的频率进行编码。因此,条形的宽度是收入范围(例如第一个 bin 为 0 到 8.8),条形的高度是人数除以宽度。结果,面积(宽×高)与人数成正比。看起来像这样:
回答by Eoin Murray
If you just want or need to sort the data into bins, without plotting take a look at histogram.js.
如果您只是想或需要将数据分类到 bin 中,而不进行绘图,请查看histogram.js。