javascript - 在 DC.js 图表中缩放 y-tick 标签（下面的 D3.js）

Question

我正在尝试找到一种方法来动态缩放图表的 y 轴，以便这些值以个位数显示，顶部带有指数表示，有效地改变了这一点：

对此：

请注意，这在例如 Matlab/Matplotlib/等中自动工作，但我正在努力寻找网络绘图框架的解决方案（也许我的搜索语言是错误的）......我知道 D3.js 不是图表库，但我愿意接受与前端 DC.js 或后端 D3.js 一起使用的解决方案

---

根据下面@Gordon 的回答进行编辑，我使用此图得到下图

chart.yAxis().tickFormat(d3.format('.1e'));

是否有可能将所有 e+6 移到顶部？还是我需要自己编写一个自定义缩放函数并插入一个单独的文本框？

标签： javascriptd3.jsplotdc.jsaxis-labels

Answer 1

在 dc.js 中，轴直接来自d3-axis。

chart.xAxis()使用and访问它们chart.yAxis()，为了减少混淆，请在图表初始化其余部分的单独语句中执行此操作。

您可以使用axis.tickFormat来控制刻度文本的格式。

您可以使用d3.format进行自动格式化。似乎指数或 SI 表示法可能适合您正在做的事情，尽管它与在屏幕截图中的单独文本元素中使用指数并不完全相同。

放在一起，这很接近

chart.yAxis().tickFormat(d3.format('.1e'))

刻度格式问题出现了很多。我想知道我们可以把这些信息放在哪里，这样人们就不必问了。