D3: Выбрать и изменить внешний SVG?

Можно ли выбирать и изменять элементы во встроенном (внешнем) SVG, созданном в Adobe Illustrator?

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:

<script>
  var my_circles = d3.select("#circles svg").selectAll("circles");
  my_circles.attr("fill", "black");
</script>

В противном случае, я открыт для других способов сделать это. Например, что-то вроде этого может сработать для выбора (который действительно определяет местоположение SVG):

var svg = document.getElementById('circles');

Но как тогда разобрать и переделать в D3? Бонусный вопрос: лучший способ отладки селекторов D3?

Ответы на вопрос(1)

Ваш ответ на вопрос