时间轴:删除没有数据的比例点

时间:2013-12-30 15:53:55

标签: d3.js

我有一个我正在密谋的数据集。我已将其建模为网络,并使用强制定向布局来显示它,除了我已经约束布局,使得在x轴上,节点根据时间排列。

我到目前为止所做的一个例子是在我自己的网站上:http://www.ericmajinglong.com/force/force.html

如您所见,我有一个时间轴。轴刻度源自数据。但是,你会发现中间存在很大的差距。

我理解比例的概念,其中我有一个域和一个范围,一个比例基本上将域映射到范围。不过,我有几个问题。

  1. 我想知道是否有可能没有创建两个水平时间轴,以排除空月?
  2. 我不得不按照线性比例进入顺序尺度吗?
  3. 进入顺序尺度而不是时间尺度会有任何不利之处吗?
  4. 为简洁起见,此处未发布代码,但我在http://www.ericmajinglong.com/force/force.js

    处找到了该代码

1 个答案:

答案 0 :(得分:4)

您可以使用序数比例,但在这种情况下,您应确保对域进行排序,并在两个间隔之间添加一些标记,以便可视化用户了解有一段时间未显示。另一种选择是创建一个自动缩短数据间隙的自定义比例,但仍然会添加特殊标记来指示缺少的时间段。

如果使用序数刻度而不是时间刻度,则需要手动格式化轴。

编辑:添加一个如何实施自定义比例的小例子

我会将自定义比例实现为带有访问器的闭包。

function customScale() {

    // Scale attributes
    var domain = [0, 1],  // Default domain
        range = [0, 1];   // Default range

    function scale(x) {
        var y = 0;
        // Compute the output value...
        return y;
    }

    // Domain and Range Accessors
    scale.domain = function(value) {
        if (!arguments.length) { return domain; }
        domain = value;
        return scale;
    };

    // range accessor...

    return scale;
}

然后配置并使用比例

var scale = customScale()
    .domain([0, 10])
    .range([2, 3]);

console.log(scale(5));

使用自定义比例也可能意味着创建自定义轴。