我正在使用 Plotly 来显示带有悬停模板的直方图，该模板显示组中的 value。即使数据很大，我也需要将精度显示为 3 位，但是 Plotly 似乎在此之前舍入了 value ，因此在下面的示例中，hovertempalte 从“28200.000 - 28500.000”跳转到“28600.00 - 28800.00”并且value 28589.02 被第二个柱吸收，而它低于该范围的最小值。
是否有任何选项可以更改 %{x} value 上的精度？我尝试使用 hoverformat: .3f 但它只在末尾添加 0，因此无法修复。
您可以在此处找到示例：https://stackblitz.com/edit/typescript-plotly-hfluqw?file=index.ts
const appDiv: HTMLElement = document.getElementById('app');
appDiv.innerHTML = `<div style="width: 100%; height: 100%" id="chart"></div>`;
import { newPlot } from 'plotly.js-dist';
const data = [
{
type: 'histogram',
marker: { color: 'red' },
mode: 'lines+markers',
x: [25000, 28333.952, 28334.08, 28589.02, 28945.89],
xbins: {
start: 25000,
end: 29340.479,
size: 394.589,
},
hovertemplate: 'value: %{x}',
},
];
const layout = {
bargap: 0.1,
hovermode: 'closest',
xaxis: {
hoverformat: ',.3f',
},
};
newPlot('chart', data, layout);编辑：修复范围间隙内的点
我最终通过从 xbin 中删除开始和结束 values 来解决我的问题的最大部分，将其从 Plotly 的逻辑中保留为默认值。显示的 values 仍然是四舍五入的，所以有一个跳跃，但范围总是覆盖所有点，所以在上面的例子中，范围固定为“28.1k - 28.4k”和“28.5k - 28.7k”。我认为开始和结束正在改变这一点并打破了一些 Plotly 舍入逻辑。
回答1
不幸的是，目前这似乎是预期的行为，这就是 Plotly 内部 bin 范围“收缩”的工作原理。
https://github.com/plotly/plotly.js/issues/5848 提出了一个类似的更简单的问题：为什么一个大小为 50 的 bin 会显示 0-40、50-90 等范围，如 https://codepen.io/bklingenberg/pen/zYwdaOq?editors=0011？
一位开发人员解释说：
这一切都是为了提高垃圾箱边缘的清晰度。准确地说，这里发生了两件事：
- 我们检测到数据 values 都是整数，所以我们将 bin 边缘向下移动了 0.5 以确保 NO values 完全正确在 bin 边缘。如果放大，您可以看到这一点，垃圾箱实际上是 -0.5 -> 49.5、49.5 -> 99.5、99.5 -> 149.5 等
- 但准确列出那些 values悬停标签会令人困惑：半整数 values 在整数数据标签中做了什么？所以我们再次查看数据并问：任何 value 最接近 bin 的左边缘或右边缘的是什么？在这种情况下，它距左侧边缘 0.5，距右侧 9.5，并且基于 50 的 bin 宽度，我们总是可以在末尾用零表示这些 values，所以这就是我们所做的 - 0-40, 50- 90、100-140 等。如果您添加一个 value，它只是稍微靠近垃圾箱的右边缘 - 比如说将 140 中的一个更改为 141 - 您会看到标签更改为 0-49、50- 99、100-149 等，因为我们不能再四舍五入到更大的数字。
我们真正不想做的是标签 50-100 和 100-150，因为那么我们将 value 放入正好 100 的 bin 是不明确的。但您可能会争辩说 bin 移位应该与范围缩小相匹配 - 即因为我们在这里将 bin 移动了 0.5，所以我们还应该精确地缩小我们报告的范围每边 0.5，到 50-99，或者如果我们想保持 50-90，我们应该将 bin 移动 5。
此解释也适用于您的情况：如果您尝试添加 value 28551，它恰好位于第 8 个 bin 的右边缘\第 9 个 bin 的左边缘（因为：25000 + (394.589 * 9) = 28551.301），您会注意到悬停的 bin 边缘变得非常精确 - https://stackblitz.com/edit/typescript-plotly-tro4jc?file=index.ts。
因此，至少目前似乎没有什么可做的。