如何在d3中以编程方式调用“点击”事件？
我正在尝试这样（也在https://gist.github.com/1703994）：
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js?1.27.2"></script>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.time.js?1.27.2"></script>
<script type="text/javascript" src="js-libs/jquery-1.7.js"></script>
<style>
<!--
#test {
width: 400px;
height: 500px;
}
-->
</style>
</head>
<body>
<script type="text/javascript">
$(function() {
var w = 600,
h = 350;
var vis = d3.select("#test").append("svg:svg")
.attr("width", w)
.attr("height", h)
.append("svg:g")
.attr("transform", "translate(" + w / 2 + "," + h / 2 + ")");
var g = vis.selectAll("g")
.data([ { x:1 , y: 2} ])
.enter().append("svg:g");
g.append("svg:path")
.attr("fill", "red")
.attr("stroke", "red")
.attr("stroke-width", "10")
.attr("d", "M 100 350 l 150 -300")
g.select("path")
.on("click", function() { console.log("Hello"); });
// XXX: how to execute click programmaticaly?
})
</script>
<div id="test"></div>
</body>
</html>
但是不起作用
我认为我们可以使用https://github.com/mbostock/d3/wiki/Internals#wiki-dispatch_on
但是怎么做呢？
牧羊人nacy3回答
-
繁星点点滴滴
只需将.on方法作为注册值的获取方法（即您的处理程序函数）进行调用，然后调用该方法的结果：g.select("path").on("click")();如果您的处理程序使用绑定的数据和/或事件字段，或者绑定了多个事件侦听器（例如，“ click.thing1”和“ click.thing2”），则情况将变得更加复杂。在这种情况下，最好使用标准的DOM方法触发一个伪事件：var e = document.createEvent('UIEvents');e.initUIEvent('click', true, true, /* ... */);g.select("path").node().dispatchEvent(e);
随时随地看视频慕课网APP
相关分类
JavaScript