我正在尝试创建一个 d3.scale.linear() 比例尺,在输入数据时为我的折线图输出值。我的数据集包含 0 到 100 之间的值,以及 null
值。图表必须显示数据中的间隙,因此除了为任何整数输入返回整数值外,如果我输入 null
,我还需要我的比例返回 null
。如果传入 null
,则常规 d3.scale.linear() 将返回 0
。
我最初的解决方案是执行以下操作:
var customScale = function(val){
if (val === null) return null;
else return d3.scale.linear().domain([0, 100])(val);
}
因此 customScale(50)
返回 0.5
而 customScale(null)
返回 null
。
但是,这样做意味着我失去了 d3.scale.linear() 的其他功能,例如 .invert()
有没有办法以某种方式扩展 d3.scale.linear() 以便它可以包含我的自定义条件?
最佳答案
对于空值,我的函数返回空值(在这种情况下,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();
},
关于javascript - 自定义 d3 线性刻度,为 null 值而不是 0 返回 null,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28328077/