javascript - 如何在plotly.js中为刻度提供普通标签(没有任何格式)

Question

我正在尝试使用plotly.js 创建一个简单的线图，其中x 轴的值在100,000 的范围内。

为了显示数据，我使用的布局如下:

var layout = {
        xaxis:{
            title:"Numbers",
            tickangle:45,
            rangemode:'nonnegative',
            autorange:true,
            exponentformat: "none"
        },
        yaxis:{
            title: "Count of events",
            tickangle:45,
            rangemode:'nonnegative',
            autorange:true
        }
    };

我正在使用此布局绘制图表，如下所示:

Plotly.newPlot('myDiv',[sample_data],layout);

之前，刻度标签显示为 200k、205k 等。将“exponentformat”设置为“none”后，现在标签显示为 205,000 或 200,000。

我这里不需要任何“，”。事实上，如果没有任何格式就最好了。任何关于我如何做到这一点的帮助将不胜感激，因为我对plotly和JS非常陌生。

Answer 1

我不知道 Plotly 中有任何参数可以确保标签不变。 但至少覆盖自定义格式并删除 , 是非常简单的。您可以通过查找类 xtick 找到所有刻度，然后更改文本。

var data = [{
    x: [0, 10000, 100000],
    y: [1, 2, 3],
    type: 'scatter'
}];
var layout = {
    xaxis: {
        type: 'linear',
        exponentformat: 'none'
    }
};
Plotly.newPlot('myDiv', data, layout);

var g_ticks = Plotly.d3.selectAll('g.xtick');
for (var i = 0; i < g_ticks[0].length; i += 1) {
    g_ticks[0][i].childNodes[0].innerHTML = g_ticks[0][i].childNodes[0].innerHTML.replace(',', '')
}

<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<div id='myDiv'></div>