2015-02-03 3 views
0

Я генерирую iframe и заполняю его с помощью div и сценария d3, чтобы отобразить содержимое SVG внутри него. Что-то вроде:Ссылка a div от d3 внутри iframe

<iframe id="content-frame""> <head></head> <body> <div id="target"></div> <script> ... d3 code here ... </script> </body> </iframe>

Внутри скрипта D3 у меня есть обычный выбор: d3.select("#target").append("svg")... но это не добавляет SVG внутри DIV.

Если я запустил d3.select("#content-frame").append("svg"), вместо этого он размещает svg правильно внутри iframe.

Я пробовал d3.select("#content-frame #target").append("svg") и аналогичные селекторы без успеха.

Любая идея?

Спасибо !.

+0

Try консоли входа в набор переменных для d3.select ("# контент-кадр") –

+1

В DOM в главном документе и в 'iframe' различны, и CSS селекторы сделать не пересекайте границы DOM. Поэтому вы не можете выбрать элемент, который хотите напрямую. См. [Этот вопрос] (http://stackoverflow.com/questions/1088544/javascript-get-element-from-within-an-iframe) для получения дополнительной информации. –

ответ

2

Чтобы отредактировать тело iframe, вам нужно использовать свойство окна содержимого. Свойство Window содержимого возвращает объект Window, сгенерированный элементом iframe (через объект окна, вы можете получить доступ к объекту документа, а затем к любому из элементов документа).

var iframeElementx = document.getElementById("MyiframeID"), 
 
    iframeElementy = (iframeElementx.contentWindow || iframeElementx.contentDocument), 
 
    iframeElementz = iframeElementy.document.body; 
 
\t \t \t \t \t \t 
 
var svg = d3.select(iframeElementz)

+1

, хотя этот код может решить проблему, пожалуйста, объясните еще несколько причин, почему и как это решает вопрос. – davejal

+0

этот код не работает для меня - я получаю ошибку с ошибкой кросс-оригинала ... :( – tomato