Question

我正在尝试将图例的位置更改为饼图的底部[默认为顶部]。在没有angular-nvd3的普通nvd3.js中，建议使用：

d3.select(".nv-legendWrap")
    .attr("transform", "translate(100,100)");

是否可以在angular-nvd3中执行此操作或是否有其他选项？

Answer 1

使用自定义属性覆盖CSS：

.your-div-class .nv-series:nth-child(1){ transform: translate(0, 0); }
.your-div-class .nv-series:nth-child(2){ transform: translate(0, 20px); }
.your-div-class .nv-series:nth-child(3){ transform: translate(0, 40px); }
.your-div-class .nv-series:nth-child(4){ transform: translate(0, 60px); }
.your-div-class .nv-series:nth-child(5){ transform: translate(0, 80px); }
.your-div-class .nv-series:nth-child(6){ transform: translate(0, 100px); }
.your-div-class .nv-series:nth-child(7){ transform: translate(0, 120px); }
.your-div-class .nv-legend{ transform: translate(180px, 150px); }
.your-div-class .nv-legendWrap{ transform: translate(-80px, 70px); }

your-div-class是指应用于包含图表指令的div容器的类。使用（x，y）像素值更改translate（0,0）属性。

以角度nvd3.js

1 个答案: