SVG 内容从 IFrame 文档内容中消失

Question

我正在尝试复制模式内特定 IFrame 元素中的内容以避免不必要的数据库调用。我正在通过 Python（参见 here）调用客户端回调，returns 我想在模态中复制的特定 IFrame 元素的索引。

这是 Python 代码片段，它切换我的模式并跟踪要复制的最近单击图形的索引：

@app.callback(
    [Output('my-modal', 'is_open'),
    Output('modal-clone', 'children')],
    [Input(f'button{k}', 'n_clicks_timestamp') for k in range(20)] + 
    [State('my-modal', 'is_open')])
def toggle_modal(*data):

    clicks, is_open = data[:20], data[20]

    modal_display = not is_open if any(clicks) else is_open

    clicked = clicks.index(max(clicks))

    return [modal_display, clicked]

app.clientside_callback(
    ClientsideFunction(namespace='clientside', function_name='clone_figure'),
    Output('modal-test', 'children'),
    [Input('modal-clone', 'children'), Input('modal-figure', 'id')]
)

以及以下 Javascript：

window.dash_clientside = Object.assign({}, window.dash_clientside, {

    clientside: {

        clone_figure: function(clone_from, clone_to) {

            source = document.getElementById(clone_from);

            console.log(document.getElementById(clone_to))
            console.log(document.getElementById(clone_to).contentDocument);

            clone = document.getElementById(clone_to);

            // set attributes of clone here using attributes from source

            return null

        }

    }

});

现在，从我的 console.log() 语句中，我注意到以下内容（请注意，屏幕截图中的 modal-clone 对应于我示例中的 modal-figure）：

contentDocument 如何在这两个日志语句之间发生变化？任何见解将不胜感激，我很难过。

Answer 1

您似乎需要 addEventListener() 到 IFrame 元素：

clone_spray: function(clone_from, clone_to) {

    source = document.getElementById(clone_from);
    clone = document.getElementById(clone_to);

    if (!clone) {return null;}

    clone.addEventListener("load", function() {

        // set attributes of clone here using attributes from source

SVG 内容从 IFrame 文档内容中消失

SVG content disappearing from IFrame documentContent

javascript

plotly-dash