Wie konvertiert man ein jQuery-Objekt in ein d3-Objekt?

Question

Ich habe ein Problem mit der Verwendung von jQuery zusammen mit D3js.

Ich habe ein jQuery-Element namens "elem" und ich möchte einige D3js Funktionen tun.

Dieser Code funktioniert:

d3.select("body").append("svg").attr("width", 300).attr("height", 300).append("g").attr("transform", "translate(150,150)").selectAll("text").data(words).enter().append("text")...... 

Dieser Code funktioniert nicht

elem.append("svg").attr("width", 300).attr("height", 300).append("g").attr("transform", "translate(150,150)").selectAll("text").data(words).enter().append("text")...... 

So wie das jQuery-Objekt in ein D3-Objekt zu konvertieren?

Answer 1

Sie können die DOM-Elemente selbst aus dem jQuery-Objekt mit .get abrufen und dann mit d3 selector auswählen, wie Sie es mit einem DOM-Element tun würden.

d3.select($("#selection").get(0)); 

Answer 2

Sie können die Objekte nicht direkt konvertieren. Sie müssen das Element mit d3js erneut auswählen. d3js Selektoren arbeiten wie diese

d3.select("#mydiv") 

So einfach die id von dergleichen so jQuery Element extrahieren

d3.select("#" + elem.attr("id")).append("svg").attr("width", 300)... 

Natürlich, wenn Sie nur jQuery mit dem Element wählen, dann sollten Sie auf d3js wechseln Auswahl stattdessen.

EDIT: Ich bevorzuge Ozans Antwort oben, verwenden Sie das!