3

とを使用しdc.jsて棒グラフを生成しています。crossfilter.jsd3.js

棒グラフは、クレジット カード トランザクションのデータを表します。トランザクションの金額 (x 軸) に対してトランザクション数 (y 軸) をプロットします。

次のようになります。

棒グラフ

データ配列は基本的に次のようになります。

[
  ...
  {
    txn_id: 1,
    txn_amount: 20
  },
  ...
]

データは、さまざまな商人などによって大きく異なり、分布については推測できません。

ご覧のとおり、このグラフはデータ自体が原因であまり役に立ちません。この場合、-$75002の前後に1 つのトランザクションがあり$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の使い方と、私が説明した方法と同様にヒストグラムを取得する方法について少し迷っています。

正しい方法は何ですか、またはどのライブラリを使用する必要がありますか:

  1. 任意に与えられたデータセットに従って、「妥当な」サイズのビンを 10 個作成します
  2. これらのビンにデータをグループ化します (実際、この部分は非常に簡単なはずです)。

物理的な間隔のヒストグラムの x​​ 軸に関しては、目盛りの間隔が不均一である必要はないと思います (したがって、ヒストグラムではなくなっている可能性があります)。

チャンクサイズが等しくないという事実にもかかわらず、目盛りが均等に配置されることを望みます。目盛りに適切なラベルを付けるようにします。

正しい方向へのポインタは大歓迎です。

アップデート:

だからd3.js、いつものように私より数歩先を行っているようで、すでに私の背中を持っています. d3.scale.quantile()x 軸を 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();

結果のチャート:

分位棒グラフ

近づいていると思いますが、どこで間違った方向に進んでいるかはまだわかりません。

4

2 に答える 2

2

外れ値テストを使用して、外れ値を取り除き、それらを極端なビンに戻すことができます。これらのビンのテキストも y に変更しますが、これは軸に目盛りのカスタム セットを渡すことで簡単に行うことができます。

多くの外れ値テストの 1 つであるショーヴネの基準を使用して、例をモックアップしました。私は当初、Grubbs 検定 (または複数の Grubbs Beck 検定) を使用することを考えていましたが、それをコーディングするには少し作業が必要です。ショーヴネの基準は、平均値から標準偏差 m を超える値を外れ値と見なすことで、非常に単純に機能します。

これをすべてここにまとめました。機能は次のとおりです。

function chauvenet (x) {
    var dMax = 3;
    var mean = d3.mean(x);
    var stdv = Math.sqrt(variance(x));
    var counter = 0;
    var temp = [];

    for (var i = 0; i < x.length; i++) {
        if(dMax > (Math.abs(x[i] - mean))/stdv) {
            temp[counter] = x[i]; 
            counter = counter + 1;
        }
    };

    return temp
}

用語はすべてかなり明白です。dMax は標準偏差の数、平均は平均、stdv は標準偏差 (または分散の平方根) です。

外れ値をヒストグラムに追加していないことに注意してください。ただし、これは非常に簡単に行うことができます。

于 2013-10-10T11:53:04.373 に答える