nvd3 python 和轴

Question

我将在 python 中使用 nvd3 来构建折线图。这是代码：

from nvd3 import lineChart
chart = lineChart(name="lineChart", x_is_date=True, x_axis_format="%Y")

xdata = [599644800000,694252800000,788947200000,883641600000,1167638400000,1199174400000,1230796800000,1262332800000,1357027200000]
ydata = [26.2, 22.4, 17.7, 14.8, 9.29, 8.08, 7.48, 6.96, 5.5]

extra_serie = {"tooltip": {"y_start": "There are ", "y_end": " calls"}}
chart.add_serie(y=ydata, x=xdata, name='Current Smokers ', extra=extra_serie, **kwargs1)
chart

这是图表：

我有三个问题：

x 轴有 9 个元素，但图表只显示其中的 3 个。如何更改代码以显示所有 9 个元素？
y轴元素类型为百分比。如何将 % 添加到 y 轴？
看起来 nvd3 不接受常规格式的日期，我不得不将它们转换为毫秒，这有点烦人。我怎样才能摆脱那些毫秒日期格式并简单地使用 1998、1995 等等？

Answer 1

我没有在 Python 中使用 NVD3，但我可以向您指出它是如何使用 JavaScript 库完成的。这是您问题的答案。

默认情况下，NVD3 会根据图表宽度减少图表中呈现的刻度数。

a) 在图表 X 轴上显示更多刻度的一种方法是增加图表的宽度。也许不是最好的方法，但它确实有效。

chart = lineChart(..., width="500")。

b) 另一种方法是定义要在图表上显示的点并将其作为数组传递给图表。 Check line 29 here.

chart.xAxis.tickValues(tickArr);

请记住，刻度标签可能会重叠，具体取决于图表的宽度和您要在图表中显示的金额

渲染时在勾号末尾附加 %。

chart.yAxis.tickFormat(function (d) {
    var format = d3.format(",.f");
    return format(d) + '%';
});

您可以按原样传递日期 e.g: 1998-02-11 有关 date & time parsing here

的更多信息

var format = d3.time.format("%Y-%m-%d");
format.parse("1998-02-11"); // returns a Date
format(new Date(1998, 02, 11)); // returns a string

希望对您有所帮助。

nvd3 python 和轴

nvd3 python and axis

python

d3.js

nvd3.js