3

私はAngularJSを初めて使用します。NDV3を使用してドーナツ円グラフを作成し、凡例を右側に移動したいだけですが、うまくいきません。

ここで、legendposition を使用して凡例をドーナツ円グラフの右側に移動しようとしましたが、うまくいきません。誰でもこれを行う方法を教えてもらえますか?ありがとう

これが私のコードです:Plunker

4

1 に答える 1

3

NVD3 は、凡例の配置を変更するオプションをサポートしていません。手動で行うか、ソースを変更する必要があります。もちろん、 の CSS を変更してnv-legendWrap、凡例の配置を試すこともできます。


回避策を見つけました。デフォルトのtransformプロパティをオーバーライドすることで、CSS の位​​置を操作できます。最初の値は X 位置で、2 番目の値は Y 位置です。

.nv-series:nth-child(1){ transform: translate(0, 0); }
.nv-series:nth-child(2){ transform: translate(0, 20px); }
.nv-series:nth-child(3){ transform: translate(0, 40px); }
.nv-series:nth-child(4){ transform: translate(0, 60px); }
.nv-series:nth-child(5){ transform: translate(0, 80px); }
.nv-series:nth-child(6){ transform: translate(0, 100px); }
.nv-series:nth-child(7){ transform: translate(0, 120px); }

.nv-legend{ transform: translate(350px, 100px); }

これがプランカーのプレビューです

于 2015-08-18T11:01:51.260 に答える