如何在 nvd3.js 中的 x 轴上显示确切的日期？

Question

我试图在 x 轴上显示确切的日期，但它总是以范围形式出现，如下图所示。请提出解决方案。

我已将以下参数提供给 $scope.options :

$scope.options = {
chart: {
type: 'historicalBarChart',
height: 450,
margin : {
top: 20,
right: 20,
bottom: 65,
left: 50
},
x: function(d){return d[0];},
y: function(d){return d[1];},
showValues: true,
valueFormat: function(d){
return d3.format(',')(d);
},
duration: 1,
xAxis: {
axisLabel: 'Date',
tickFormat: function(d) {
return d3.time.format('%d-%m-%y')(new Date(d))
},
},
yAxis: {
axisLabel: 'Body Weight',
axisLabelDistance: -10,
tickFormat: function(d){
return d3.format(',')(d);
}
},
tooltip: {
keyFormatter: function(d) {
return d3.time.format('%x')(new Date(d));
}
},
zoom: {
enabled: true,
scaleExtent: [1, 10],
useFixedDomain: false,
useNiceScale: false,
horizontalOff: false,
verticalOff: true,
unzoomEventType: 'dblclick.zoom'
}
}
};

Answer 1

我已经通过更改 scaleExtent: [1, 10] 中的值解决了这个问题。此选项将制作图表以显示比例 x-axis 值

如何在 nvd3.js 中的 x 轴上显示确切的日期？

How to show exact date in x-axis in nvd3.js?

javascript

graph

nvd3.js

angular-nvd3