3

d3 で独自の scale() 関数を作成するにはどうすればよいですか?

d3.scale.linear()d3 の素敵な線形スケールを、自分で作成したい別の関数に置き換えようとしています。私の新しいスケールは累積分布関数に基づいているため、中央値は x 軸の中心に表示され、中央値から標準偏差の 2 倍の値は x 軸の中心から 2 倍離れて表示されます。平均からの標準偏差の 1 つとして。

ここに私の jsfiddle ページへのリンクがあります: http://jsfiddle.net/tbcholla/kR2PS/3/ (私のコードについて他のコメントをいただければ幸いです!)

今私は持っています：

var x = d3.scale.linear()
.range([0, width])
.domain(d3.extent([0, data.length]));

と を見てきましscale.pow()たscale.log()。今、私は新しい関数を作成したいと思います! ありがとう！編集:私は解決策を保持する可能性のある関数scale.quantile()を見つけました。関連する質問: scale.quantile() を使用した折れ線グラフのプロット

4

1 に答える 1

1

これは、d3.scale.liner() に新しい機能を追加する方法の例です。null 値の場合、関数は null を返します (この場合、d3.scale.liner() は 0 を返します)。主なアプローチは、元のスケールと彼のすべてのメソッドをラップすることです。

すべてのケースでこの機能をテストしたわけではありません。しかし、基本的な機能については機能しています。残念ながら、私はそれを行う簡単な方法を見つけられませんでした:(

/**
 * d3.scale.linear() retrun 0 for null value
 * I need to get null in this case
 * This is a wrapper for d3.scale.linear()
 */
_getLinearScaleWithNull: function() {
    var alternativeScale = function(origLineScale) {
        var origScale = origLineScale ? origLineScale : d3.scale.linear();

        function scale(x) {
            if (x === null) return null; //this is the implementation of new behaviour
            return origScale(x);
        }

        scale.domain = function(x) {
            if (!arguments.length) return origScale.domain();
            origScale.domain(x);
            return scale;
        }

        scale.range = function(x) {
            if (!arguments.length) return origScale.range();
            origScale.range(x);
            return scale;
        }

        scale.copy = function() {
            return alternativeScale(origScale.copy());
        }

        scale.invert = function(x) {
            return origScale.invert(x);
        }

        scale.nice = function(m) {
            origScale = origScale.nice(m);
            return scale;
        }

        scale.ticks = function(m) {
            return origScale.ticks(m);
        };


        scale.tickFormat = function(m, Format) {
            return origScale.tickFormat(m, Format);
        }

        return scale;
    }

    return alternativeScale();
},
于 2015-03-25T16:46:09.973 に答える