使用tickValues单击图例后,刻度线图上的折线消失

时间:2019-04-15 11:25:00

标签: d3.js nvd3.js

我在以下查询中使用angular2-nvd3.js版本1.0.7-

使用选项值中的勾号来表示在x轴上观察到的折线图日期不一致。 在使用tickValues能够动态修改有效日期时,但是在图例上单击/调整浏览器窗口大小在x轴上的刻度消失了。

任何帮助将不胜感激。

//Problem code

xAxis: {
        axisLabel: '',
        ticks: 22,
        showMaxMin: false,
        rotateLabels: -90,
        tickFormat: function (d) {
          return d3.time.format('%m/%d/%y ')(new Date(d));
        }
}



  **[Tried below solution code]**

  xAxis: {
        axisLabel: '',
          tickValues: function(d){
          var between = []          
          var secondDate =  d[0].values[d[0].values.length-1].date;
          var firstDate = d[0].values[0].date;

          //get all dates between max and min date
          while (firstDate <= secondDate) {
              between.push(new Date(firstDate));
              firstDate.setDate(firstDate.getDate() + 4);
          }

      return between;
         },       

        showMaxMin: false,
        rotateLabels: -90,
        tickFormat: function (d) {
          return d3.time.format('%m/%d/%y ')(new Date(d));
        }
      }

预期:使用tickValues angular2-nvd3 v1.0.7的x轴刻度不应在图例单击/ Chrome浏览器窗口调整大小时消失。

实际:使用angular2-nvd3 v1.0.7在x轴上具有随机间隔的日期不一致。

0 个答案:

没有答案