如何在情节中使颜色条的刻度值不均匀

Question

在 plotly 中，如何为等高线图渲染这种类型的颜色条？只是想弄清楚轮廓是否支持轮廓图颜色条的不均匀刻度值。

上面的图片是我正在寻找的情节。

tickvals 和 ticktext 无法按预期工作。

Answer 1

试试这个 Stackoverflow 问题：

Plotly axis as exponential format

直接文本形式：所有致：@MaximilianPeters

1：如何使它在子图上工作。我尝试在构建中调用 java 每个子图，但所有图都没有指数。

2nd/3rd/etc 的滴答声。子图的类名如y2tick/y3tick/等。我们可以让我们的 d3 选择器不那么具体，然后使用each 来更改所有刻度。

ticks = Plotly.d3.selectAll('g.yaxislayer-above').selectAll('text');
ticks.each(function(d, i) 
{
  var num = parseInt(d.text).toExponential();
  Plotly.d3.select(this).text(num);
})

2：使其适用于 x 和 y 轴（我尝试过，失败并哭了 小）

只需将 selectAll 语句更改为Plotly.d3.selectAll('g.xaxislayer-above').selectAll('text')

3：当轴不存在时，让它不破坏宇宙 一个数字（我的应用程序也可以绘制日期列，所以它需要检查 是否真的是数字输入）

您可以更改 fixTicks 函数以检查输入值是否为数字，例如通过使用typeof 或正则表达式。使用 1999、2000 等值可能会很棘手，您需要手动解决。

4：如果可能，打印为 1.23E+1 而不是 1E+1

toExponential 取一个parameter，它是“小数点后符号中的位数”，即num.toExponential(3) 在您的情况下可以解决问题。

来自评论：当刻度上的值为负值时，我似乎得到 NaN

Plotly 使用 Unicode minus sign 而不是常规的破折号。您可以将其替换为以下 JavaScript 行：

var num = parseInt(tick[0].innerHTML.replace(/\\u2013|\\u2014|\\u2212/g, '-'));

注意：R 中需要双反斜杠 \\，纯 JavaScript 只需要一个 \。