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

Posted 2023-02-18

【中文标题】如何在情节中使颜色条的刻度值不均匀

【英文标题】：How to have un-even tick value for color-bar in plotly

【发布时间】：2019-04-25 12:45:41

【问题描述】：

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

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

tickvals 和 ticktext 无法按预期工作。

【参考方案1】：

试试这个 *** 问题：

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 只需要一个 \。

【讨论】：

更改值时会反映图中的值还是仅更改颜色条的文本？还没试过，因为我现在不在。

@Rod_Algonquin 老实说，我不知道。你需要测试一下：/对不起。

这实际上并不能反映等值线图中颜色条的颜色。因此，当执行上述解决方案时，它只会更改您已经可以在库中执行的颜色条的值。