Javascript 在d3.js v4中创建asinh（反双曲正弦）比例

这将取代对数标尺，使其能够处理负数。虽然我一直在尝试使用d3的对数刻度源作为起点，但我还没有看到很多自定义刻度的示例。

文档中最好的示例似乎是刻度的插值功能。看

---

我不是一个真正的d3专家，所以我希望这能有所帮助。

据我所知，没有办法在d3中制作定制的音阶（至少不是你想要的那种感觉）。所有D3标度分两步缩放：

使用域，在给定解交织函数的情况下对输入进行解交织

使用范围，对步骤1的中间结果进行插值，以获得输出

我相信你的理想答案基本上可以回答这个问题，“如何将D3刻度的去极化功能设置为自定义功能？”，我认为目前不可能实现这一点

但是，可以设置插值函数。Mike Bostock的示例演示了如何使用D3内置的ease函数之一设置插值：

这个例子有一种“鱼眼镜头”的效果，这可能与你想要的正好相反。您可以使用指数小于1的多项式缓和函数d3.easePolyInOut，以获得更接近日志缩放的结果（请参阅我的代码片段）。不幸的是，没有“logInOut”或“asinhInOut”，因此如果需要更陡的衰减（比多项式），则必须编写自己的缓和/插值函数

var-data=Array.from（Array（21），（\ux，i）=>{return 10*（i-10）}）
var svg=d3。选择（“svg”），
边距={顶部：50，右侧：20，底部：5，左侧：20}，
宽度=svg.attr（“宽度”）-margin.left-margin.right，
高度=svg.attr（“高度”）-margin.top-margin.bottom，
g=svg.append（“g”）.attr（“transform”、“translate”（+margin.left+）、“+margin.top+”）；
var=0.25
var x=d3.scaleLinear（）
.domain（[-100100]）
.范围（[0，宽度]）
.interpolate（easeInterpolate（d3.easePolyInOut.Exp）指数）；
g、 附加（“g”）
.attr（“类”、“轴--x”）
.call（d3.axisBottom（x））；
g、 选择全部（“圆”）.data（数据）。输入（）。追加（“圆”）
.attr（“cx”，（d）=>x（d））
.attr（“cy”，-10）
.attr（“r”，3）
.attr（“填充”、“钢蓝”）
函数ease插值（ease）{
返回函数（a，b）{
var i=d3.插值（a，b）；
返回函数（t）{
返回i（ease（t））；
};
};
}

.axis文本{
字体：10px无衬线；
}
.轴线路径，
.轴线{
填充：无；
行程：#000；
形状渲染：边缘清晰；
}

var color = d3.scaleLinear()
    .domain([10, 100])
    .range(["brown", "steelblue"])
    .interpolate(d3.interpolateHcl);