angularjs nvd3多栏图表xAxis刻度未显示

本文介绍了angularjs nvd3多栏图表xAxis刻度未显示的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在使用angularjs nvd3多栏图表
图表xAxis刻度不显示如下.

I'm using angularjs nvd3 multibar chart
chart xAxis tick do not show like below.

我想显示所有xAxis刻度线形成的％Y/％m/％d％H:％M

I want to show all xAxis tick formed %Y/%m/%d %H:%M

这是我的代码.

  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);
          }
       }
       }
    };

请帮助我.

推荐答案

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

try to add the following priorities in your chart object

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

这篇关于angularjs nvd3多栏图表xAxis刻度未显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

Xaxis

angularjs nvd3多栏图表xAxis刻度未显示

问题描述

推荐答案