轴标签恢复到原来的位置隐藏系列

Question

在my NVD3 chart here后，我已经向下移动的X轴标签，以便与垂直排列的日期去。对于我所做的：

xTicks.select('.nv-axislabel').attr("y", 90); // line # 81 in JS 

现在的问题是，如果我隐藏任何使用右上角的控制系列，这个X轴标签恢复到它behing日期，其原来的位置。

我该如何让它保持在新的位置，保持不变？

jsFiddle

Answer 1

的有些脏溶液，而是可以是足够好：

改变标签的y属性之后，除去其中使用由D3类内部挑标签并复位其属性：

xTicks.select('.nv-axislabel') 
    .attr("y", 90) 
    .classed({'nv-axislabel':false}); 

然后，因为它会出现D3只是会在不必要的位置的新标签，你可以添加这个CSS文件：

.nv-x .nv-axislabel { 
    display:none; 
} 

我添加它作为一个规则，因为以编程方式执行（使用.style()）需要很长时间，你可以看到它闪烁。

FIDDLE

Answer 2

如果您更新NVD3库，版本1.1.11b

可以使用旋转标签的内置功能。试试这个：

chart.xAxis 
.tickPadding(-5).rotateLabels(-90); 

变化.tick major > text的x属性10移动位置有点低。

然后你会不需要下面的代码：

// translate and rotate x-axis ticks 
var xTicks = d3.select('.nv-x.nv-axis > g').selectAll('g'); 

xTicks.selectAll('g > .tick > text') 
.attr('transform', function(d, i, j) { 
    return 'translate (-10, 40) rotate(-90 0,0)' 
}); 

// move x-axis label down 
xTicks.select('.nv-axislabel').attr("y", 90) 

希望它可以帮助