嵌入应用程序时从 D3 Observable 中删除单元格

Question

假设我正在将 D3 Observable 中的 this 视觉对象嵌入到我自己的应用程序中。我们可以通过下载 tarball 文件来嵌入这些文件：

但这会下载所有对运行在线笔记本有用但在应用程序中显示视觉效果时不再需要的单元格。我怎样才能删除这些单元格？

我可以运行:

$('span').remove()

...但必须有更好的方法。

Answer 1

没问题 – 要仅显示 chart 单元格，您可以更改

const main = runtime.module(define, Inspector.into(document.body));

显示所有单元格，

const main = runtime.module(define, name => {
  if (name == 'chart') {
    return new Inspector(document.body)
  }
});

它只查找名为 'chart' 的单元格。

Answer 2

只是补充一下这个答案，这是根据标题显示多个单元格的方式：

在 HTML 文件 (index.html) 的 body 中，创建元素（我将使用 2）：

<p id="title"></p>
<div id="chart"></div>

然后在 <script> 标签中添加以下内容：

function renderNotebook(notebook, cellNames) {
  new Runtime().module(notebook, name => {
    if (cellNames.includes(name)) {
      return new Inspector(document.querySelector(`#${name}`));
    }
  });
}

renderNotebook(define, ["title", "chart"])

请注意，我要显示的单元格称为 title 和 chart。希望这可以帮助！资料来源：https://talk.observablehq.com/t/overcoming-r-is-not-iterable-with-new-runtime-or-another-mistake/2729/7

嵌入应用程序时从 D3 Observable 中删除单元格

Remove Cells from D3 Observable When Embedding into Application

javascript

d3.js

observablehq