d3尝试在点击时在div或iframe中打开html

Question

我有一个d3条形图，我想拥有它，所以当在图表上单击一个条形时，HTML将被加载到页面的另一部分。正如我一直试图研究如何做到这一点，我变得越来越困惑。我应该使用<div>还是<iframe>？我有这个就点击事件而言：

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

但我不认为我可以使用它，因为我想要不同的栏来打开不同的内容。所以我还需要弄清楚如何将哪个栏点击到打开哪个文件。谁能指出我正确的方向？感谢。

Answer 1

添加一个onclick事件，将点击的bar引用传递给加载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");
  } 

}