Генерация гистограммы для сильно искаженных данных
м использую,dc.js
crossfilter.js
а такжеd3.js
создать диаграмму.
Диаграмма представляет данные для транзакций по кредитным картам. Он отображает количество транзакций (ось Y) над суммой в долларах (ось X).
Это выглядит так:
Массив данных в основном выглядит так:
[
...
{
txn_id: 1,
txn_amount: 20
},
...
]
Данные сильно различаются в зависимости от разных продавцов и т.д., и я могуне делайте предположений о распределении.
Как вы можете видеть этот график невсе это полезно из-за самих данных. В этом случае есть 1 транзакция для-$7500
а также2
около .$7500
Между ними есть и другие суммы, но большинство транзакций группируются вокруг$0 - $100
где вы можете увидеть шип
К сожалению, достаточно различий, чтобы вы моглиЯ даже не вижу баров для менее частых транзакций.
этоответ кажется близким, но не совсем там.
Что я'Мне действительно хотелось бы разбить отметки оси X на 10 порций разумного размера, которые разумно группируют суммы транзакций, чтобы сделать график более полезным.
Например, пустьскажем, в этом случае средняя сумма сделки$20
, И крайние минимальные и максимальные значения-$7500
а также$7500
Так что в этом конкретном примере я хотел бы, чтобы ось X была разделена на части так:
Bin 1: -$1000 >= transaction amount
Bin 2: -$100 >= transaction amount > -$1000
Bin 3: -$50 >= transaction amount > -$100
Bin 4: $0 >= transaction amount > -$50
Bin 5: $15 >= transaction amount > $0
Bin 6: $25 >= transaction amount > $15
Bin 7: $40 >= transaction amount > $25
Bin 8: $100 >= transaction amount > $40
Bin 9: $1000 >= transaction amount > $100
Bin 10: transaction amount > $1000
(размер куска / контейнера становится все меньше и меньше по мере приближения к среднему значению, которое мы получаем).
По общему признанию этос тех пор прошло много летмы сделали серьезное исследование статистики, поэтому ям довольно ржавый. Но кажется, что способ, которым я разбиваю свои данные на бункеры / блоки, будет во многом зависеть от стандартного отклонения моих данных.
Я думаю, у меня есть хорошее чувство, что я хочу, яЯ просто немного потерял в том, как использовать (,d3.js
d3.mean()
d3.quantile()
?) а такжеdc.js
чтобы получить гистограмму так же, как яя описал.
И что's правильный путь, или какие библиотеки я должен использовать для:
Создать 10 'разумно» размер бункеров в соответствии с произвольно заданным набором данныхСгруппируйте данные в эти корзины (на самом деле, эта часть должна быть довольно простой)В терминах гистограммы физического расстоянияс осью х, я нене думаю, что этонеобходимо или желательно, чтобы тики были расположены неравномерно (таким образом, возможно, это уже не гистограмма).
Я бы предпочел, чтобы клещи оставались равномерно распределенными, несмотря на то, что размеры кусков не равны. Я просто буду отмечать галочки соответствующим образом.
Любые указатели в правильном направлении будут высоко оценены.
Обновить:
Так кажетсяd3.js
на несколько шагов впереди меня, как обычно, и уже получил мою спину. Я верю, что могу использоватьd3.scale.quantile()
разбить ось х на 10 квантилей (дециль). Действительно, яЯ настроил свою квантильную шкалу, и, похоже, все делает правильно, когда я вводю числа непосредственно в функцию квантильной шкалы (через консоль JS), она выводит правильный интервал (из 10).
Но, к сожалению, мой график все еще испорчен. Вот мой код:
var datum = crossfilter(data),
amount = datum.dimension(function(d) { return +d.txn_amount; }),
amounts = amount.group();
amountsChart = dc.barChart("#dc-amounts-chart");
amountsChart
.width(defaultWidth)
.height(defaultHeight)
.margins({top: 20, right: 20, bottom: 20, left: 50})
.dimension(amount)
.group(amounts)
.centerBar(true)
.gap(5)
.elasticY(true)
.x(d3.scale.quantile().domain(amounts.all().map(function(d) {
// d.key is the transaction dollar amount,
// d.value is the number of transactions at that amount
return d.key;
}))
.range([0,1,2,3,4,5,6,7,8,9]));
amountsChart.yAxis().ticks(5);
dc.renderAll();
и полученная диаграмма:
Я думаю я'Я близко, но все еще не уверен, где яЯ делаю неправильный поворот.