c3.js Donut-Diagramm onclick Funktion

Question

Ich habe ein C3js Donut-Diagramm in meiner Website erstellt, ich habe eine onclick Funktion in der Tabelle zugewiesen und ich möchte einen Button haben, um die Funktion zu feuern, aber, kann ich keine guter Ansatz, es zu tun.

Ich habe versucht, einen Knopf zu schaffen, um die Funktion wie unter Feuer, das Element zu finden und binden Sie es an meine .onclick() Funktion:

$("#test").click(function(){ 
     $(".c3-arc-data2").click(); 
    }); 

Aber es funktioniert nicht.

Bitte beachten Sie das Beispiel in der fiddleJS: https://jsfiddle.net/mcd6ucge/52/

Erweiterung:

Ich habe eine if-Anweisung für den Abschnitt, der die Daten des Diagramms ändern wird, und wenn die Daten waren ändern ein weiterer Fall der onclick Funktion nicht

if(x = "something"){ 
     $(".uldateBtn1").html(
     '<li id="test-fliter" class="dateBtn hvr-underline-from-left" style="margin-top:10px !important;">test</li>' 
           ) 

     $("#test-fliter").click(function(){ 

      var evt = new MouseEvent("click");//make a mouse event 
      d3.select(".c3-arc-test").node().dispatchEvent(evt); 

     }); 
    } 

else{ 
$(".uldateBtn1").html(
    '<li id="test2-fliter" class="dateBtn hvr-underline-from-left" style="margin-top:10px !important;">test</li>' 
          ) 

    $("#test2-fliter").click(function(){ 

     var evt = new MouseEvent("click");//make a mouse event 
     d3.select(".c3-arc-test2").node().dispatchEvent(evt); 

    }); 

} 

das funktioniert, wenn arbeitet gut, aber die sonst nicht funktioniert.

Answer 1

Machen Sie es wie dieser

$("#test").click(function(){ 
    var evt = new MouseEvent("click");//make a mouse event 
    //dispatch the event on the element. 
    d3.select(".c3-arc-data1").node().dispatchEvent(evt); 
}); 

Arbeits Code here