javascript - X 轴标签错位

标签 javascript d3.js nvd3.js

my NVD3 chart here ,我旋转并平移了 X 轴刻度。因此,X 轴标签 My X-axis 也受到了影响。

JS:

    var xTicks = d3.select('.nv-x.nv-axis > g').selectAll('g');

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

如何修改此代码以跳过 X 轴标签的格式设置?

jsFiddle

最佳答案

您之前已选择了要转换的所有 text 元素。仅选择勾号标签。

尝试以下方法

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

// Bring the 'My X-Axis' label down to avoid overlap.
xTicks.select('.nv-axislabel').attr("y", 90)

希望对你有帮助

关于javascript - X 轴标签错位,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24525794/

相关文章:

javascript - D3 中的选择,Jquery

javascript - nvd3时间H :M:S displaying incorrectly in axis

d3.js - NVD3 图表未在隐藏选项卡中正确呈现

javascript - 如何向 nvd3 饼图添加 tabindex 属性?

javascript - X 到 Canvas 上绘制的形状边缘的距离

javascript - onsubmit cakephp图标更改功能

javascript - react js : initialize ZURB Foundation JS

JavaScript 剥离页面的 URL

javascript - 使用 D3.js、TypeScript 和 Angular 绘制饼图时出现编译错误

javascript - getBBox() 和 getCompulatedTextLength() 一次有效,一次无效