D3.js d3尝试在div或iframe中单击打开html

我有一个d3条形图，我想有它，所以当在图表上点击一个条形图时，HTML被加载到页面的另一部分。当我试图研究如何做到这一点时，我变得越来越困惑。我应该使用

还是

？就点击事件而言，我有以下功能：

.on("click", function() { alert("Hello world"); })

---

但我不认为我可以使用它，因为我想要不同的酒吧打开不同的内容。因此，我还需要弄清楚如何将单击的条与打开的文件联系起来。谁能给我指出正确的方向吗？谢谢。

添加一个onclick事件，将单击的条引用传递给加载html的函数

.on('click', function(d) {loadHtml(d)});

然后创建一个loadHtml函数

function loadHtml(clickedBar)
{
  if (clickedBar[0] = "foo")
  {
      $('#DivForLoadingHtml').load("http://mydomain.xyz/foo.htm");
  }   
  if (clickedBar[0] = "bar")
  {
      $('#DivForLoadingHtml').load("http://mydomain.xyz/bar.htm");
  } 

}

---

我建议您使用常规函数而不是箭头函数：在D3中，我们经常使用

this

。在常规函数中，

这个

将是单击的矩形，但不是在箭头函数中。箭头函数似乎返回单击的条。不，它没有：它只是删除基准并重新绘制图表。由于选择了

selection.exit（）

，该条消失。是的，谢谢您指出了区别。我已经更新了我的答案。回到我原来的问题，不知道我在做什么…加载html的函数会是什么样子？如果我想将内容加载到同一网页的一部分，它应该是div还是iframe？