angularjs nvd3 multibar chart xAxis tick不显示

时间:2016-11-30 07:31:02

标签: d3.js charts angular-nvd3

  1. 我使用angularjs nvd3 multibar chart
  2. 图表xAxis tick不显示如下。 enter image description here

  3. 我想显示所有xAxis刻度形成%Y /%m /%d%H:%M

  4. 这是我的代码。

      this.$scope.options = {                                                                                            
        chart: {                                                                                                       
           type: 'multiBarChart',                                                                                      
           height: 450,                                                                                                
           margin : {                                                                                                  
              top: 20,                                                                                                 
              right: 20,                                                                                               
              bottom: 60,                                                                                              
              left: 65                                                                                                 
           },                                                                                                          
    
           x: function(d){ return d[0]; },                                                                             
           y: function(d){ return d[1]; },                                                                             
    
           color: d3.scale.category10().range(),                                                                       
           duration: 300,                                                                                              
           stacked: true,                                                                                              
           clipEdge: true,                                                                                             
           clipVoronoi: false,                                                                                         
    
           xAxis: {                                                                                                    
              axisLabel: 'Time',                                                                                       
              tickFormat: function(d) {                                                                                
                 let formedDate = d3.time.format('%Y/%m/%d %H:%M')(new Date(d));                                       
                 return formedDate                                                                                     
              },                                                                                                       
              showMaxMin: false,                                                                                       
              staggerLabels: true                                                                                      
           },                                                                                                          
    
           yAxis: {                                                                                                    
              axisLabel: 'Data',                                                                                       
              axisLabelDistance: -20,                                                                                  
              tickFormat: function(d){                                                                                 
                 return d3.format()(d);                                                                                
              }                                                                                                        
           }                                                                                                           
           }                                                                                                               
        };                                                                                                                 
    

    请帮帮我。

1 个答案:

答案 0 :(得分:0)

尝试在图表对象中添加以下优先级

chart = {
   ...  
   reduceXTicks:false,
   ...
   xAxis : {
      .tickFormat: "%Y/%m/%d %H:%M"
   }
}