D3: Externes SVG auswählen und ändern?
Ist es möglich, Elemente in einer in Adobe Illustrator erstellten eingebetteten (externen) SVG auszuwählen und zu ändern?
html:
<object data="circles.svg" type="image/svg+xml" id="circles"></object>
circles.svg:
<svg xmlns="http://www.w3.org/2000/svg" width="100px" height="100px" >
<circle id="c_red" fill="#A00" stroke="#000" cx="40" cy="40" r="40"/>
<circle id="c_grn" fill="#0A0" stroke="#000" cx="60" cy="60" r="40"/>
</svg>
d3 code:
<script>
var my_circles = d3.select("#circles svg").selectAll("circles");
my_circles.attr("fill", "black");
</script>
Ansonsten bin ich offen für andere Möglichkeiten. Zum Beispiel könnte so etwas bei der Auswahl funktionieren (wodurch die SVG tatsächlich gefunden wird):
var svg = document.getElementById('circles');
Aber wie kann man dann D3 analysieren und ändern? Bonusfrage: Der beste Weg, um D3-Selektoren zu debuggen?