3

如何在 d3 中创建自己的 scale() 函数？

我正在尝试用d3.scale.linear()我想自己创建的不同功能替换 d3 中漂亮的线性比例。我的新比例将基于累积分布函数，因此中值将出现在 x 轴的中心，而与中值相差两个标准差的值将出现在距离 x 轴中心两倍的位置作为与平均值的一个标准偏差的东西。

这是我的 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 回答