如何隱藏n3圖表中的第一個孩子和最後一個孩子的刻度

Question

我使用的是使用line-chart.min.js和d3.v2.js插件的n3圖表。我想隱藏x軸0刻度值和最後一個孩子刻度值。如何在下面的圖片中完成。

請，有人能幫我解決這個問題，我不想APR11和最後一跳值會動態變化。

app.directive('barChart', [ 
         function() { 

          return { 
           restrict: 'EA', 
           template: '<linechart data="data" options="options" width="550" height="291"></linechart>', 
           scope: { 
            range: '=', 
           }, 
           link: function(scope, elements, attrs){ 
            scope.$watch("range", function() { 
            var values = scope.range; 
            scope.data = values; 
             scope.options = { 
              yaxis : {name: "Calories",labelalign:"-135"}, 
              stacks: [{axis: "y", series: ["firstVal", "secondVal", 'thirdVal']}], 
              fonts: {family: 'serif', size: '14px'}, 
              axes: { 
               x: {key: 'x', type: 'date',labelFunction: function(x) { return d3.time.format('%b %d')(new Date(x));}}, 
               y: {key :'y',type: 'linear',min:0} 
              }, 
              transition: {ease: 'elastic', duration: 1000, delay: 100}, 
              series: [ 
               {id: 'secondVal', y: 'secondVal', axis: 'y', color: "#b3d660", type: 'column', drawDots: true, dotSize: 4, label: 'Labe1'}, 
               {id: 'firstVal', y: 'firstVal', axis: 'y', color: "#ff8669", thickness: '2px', type: 'column', label: 'Label2'}, 
               {id: 'thirdVal', y: 'thirdVal', axis: 'y', color: "#52c4dc", type: 'column', dotSize: 2, label: 'Label3'} 
              ], 
              lineMode: 'linear', 
              tension: 0.2, 
              tooltip: { 
               mode: 'scrubber', formatter: function (x, y, series) { 
                return series.label + ', ' + Math.round(y); 
               } 
              }, 
              drawLegend: true, 
              drawDots: true, 
              columnsHGap: 5 
             } 
            }); 
           } 

          };}]); 

Answer 1

對於n3圖表v2，可以爲每個軸定義一個tickFormat函數。

添加一個名爲tickFormat功能scope.options.axes.x說是這樣的：

tickFormat: function(value, index){ 
    var firstOrLast = (index === 0) || (index === scope.values.length-1); 
    return firstOrLast ? "" : value; 
} 

不確定N3-V1的圖表，但我看到你已經有一個名爲的labelFunction的功能scope.options.axes.x。你可以做類似上面的代碼的東西，但你只是檢查，如果你的參數「X」在scope.values你的第一個或最後一個值相匹配。