历史条形图：
我正在使用NVD3历史条形图，但无法显示所有X轴刻度值。我只能显示5个值，而不是整个数组。请找到我的代码
var app = angular.module('plunker', ['nvd3']);
var tickMarks = [2001,2002,2003,2004,2005,2006,2007,2008,2009,2010,2011];
app.controller('MainCtrl', function($scope) {
$scope.options = {
chart: {
type: 'historicalBarChart',
height: 450,
margin : {
top: 20,
right: 20,
bottom: 60,
left: 50,
showXAxis:false,
showYAxis:false
},
x: function(d){return d[0];},
y: function(d){return d[1];},
showValues: true,
reduceXTicks:"false",
showXAxis:true,
showYAxis:false,
/*valueFormat: function(d){
return d3.format(',.1f')(d);
},*/
transitionDuration: 500,
//forceX: [1],
showMaxMin: false,
xAxis: {
tickSize:'10',
values: [1,2,3,4,5,6,7,8,9,10],
axisLabel: 'X Axis',
tickFormat: function(d) {
return d;
},
//reducexTicks:true,
//rotateLabels: 10,
showMaxMin: false,
},
yAxis: {
//axisLabel: 'Y Axis',
//axisLabelDistance: 35,
/*tickFormat: function(d){
return d3.format(',.1f')(d);
}*/
}
}
};
$scope.data = [
{
"key" : "Quantity" ,
"bar": true,
"values" : [ [ 1 , 4] , [ 2 , 2] , [ 3 , 1] , [ 4 , 3] , [ 5 , 4] , [ 6 , 5] , [ 7 , 4] , [ 8 , 7] , [ 9 , 6] , [ 10 , 4] , [ 11 , 6] , [ 12 , 5] , [ 13 , 6] , [ 14 , 4] , [ 15 , 5] , [ 16 , 4] , [ 17 , 5] , [ 18 , 8] , [ 19 , 5] , [ 20 , 6] , [ 21 , 5] , [ 22 , 6] , [ 23 , 6] , [ 24 , 6] , [ 25 , 7] , [ 26 , 6] , [ 27 , 5] , [ 28 , 4], [29, 5], [30, 4], [31, 7] ],
color:'blue'
}];
});
请帮助我解决此问题。
最佳答案
您几乎可以通过以下方式获得它：
reduceXTicks
staggerLabels
但是您需要将所有值包括在刻度值中：
// !!! I have not tested this on Your code, but this magic works for me.
// You also need to declare data first, then options.
values: $scope.data.values.map( function(d) { return d[0]; })
关于java - 无法在NVD3中显示所有XAxis刻度值，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/33556255/