13

D3 に問題があります。もう一度 Element を追加すると、親ノードに要素が重複してしまいます。

  node.enter().insert("svg:g")
      .attr("class", 'test')
      .attr("width", '63px')
      .attr("height", '68px')
      .call(force.drag);

  node.append("svg:circle")
      .attr("class", "bg-circle")
      .attr("r", "30px");

たとえば、次のようになります。

<g class="test">
   <circle class="bg-circle" />
   <circle class="bg-circle" />
</g>

でも私はしたい：

<g class="test">
   <circle class="bg-circle" />
</g>

関数を呼び出してノードをもう一度設定する場合でも。

4

3 に答える 3

-1

同じ問題があり、プレビューの回答が役に立たなかったので、次のようにして解決しました：

私のhtmlで。同じ種類のチャートを作成するために異なるデータ ソースを呼び出す 2 つのボタンがあるため、ボタンの 1 つをクリックするたびに、重複したグラフが表示されます (関数 1 は _des を使用して div のデータを呼び出し、関数 2 は _ic div のデータを呼び出します)。

<div>
  <h3>Graficas</h3>
  <label>
    <input id="des" type="checkbox" class="radio"  name="fooby[1][]" checked onchange='load_des(this)'/>data 1 </label>
  <label>
    <input id="ic" type="checkbox" class="radio"  name="fooby[1][]" onchange='load_ic(this)'/>data 2</label>
</div>

<div class="container">
    <div id="donut_des"></div>
    <div id="bars_des" ></div>
    <div id="donut_ic"></div>
    <div id="bars_ic" ></div>
</div>

したがって、各関数の main.js ファイルにこれを追加しました。

function load_des(obj) {
  if($(obj).is(":checked")){

  document.getElementById('donut_ic').innerHTML = "";
  document.getElementById('bars_ic').innerHTML = "";

// do everything else normally 
}

function load_ic(obj) {
  if($(obj).is(":checked")){

  document.getElementById('donut_des').innerHTML = "";
  document.getElementById('bars_des').innerHTML = "";

// do everything else normally 
}

他の方法では解決できなかったので、これが誰にとってもうまくいくことを願っています。

于 2020-05-11T17:34:43.817 に答える