Question

我正在使用flowchart.js来创建图表。我希望能够将click事件绑定到图表上的每个箭头，以对该唯一路径执行某些操作。

据我在检查员看到，这些线路没有ID ......有没有办法解决这个问题？

Answer 1

我验证了您所写的内容并且您更正了，这些行（svg路径）没有ID。此外，看起来他们没有太多的编程API。所以我想出了一种为每条路径分配ID的hacky方法。

致电diagram.drawSVG(...);后，添加以下代码，为每条路径创建唯一ID。

var i = 0;
$("path").each(function() {
  $(this).attr("id", "path" + i.toString());
  i++;
});

然后我在路径元素中添加了一个点击处理程序，以验证ID是否已正确分配。

$(document).on("click", "path", function () {

  //Display to the console
  var clickedPath = $(this)[0];
  console.log(clickedPath);

  // Build a string of attributes by looping them
  var alertString="";
  for (i=0; i < clickedPath.attributes.length; i++) {
    alertString += clickedPath.attributes[i].name + "=" + clickedPath.attributes[i].value + "\n";
  }

  //Alert the attributes
  alert(alertString);
});

您可以在https://codepen.io/anon/pen/EoqPQG?editors=0010

查看结果

绑定到flowchart.js中的行

1 个答案: