Javascript d3停止播放——”；mousedown.log“；
我正在学习d3，在前面的一个主题中讨论了Javascript d3停止播放——”；mousedown.log“；,javascript,d3.js,dom-events,Javascript,D3.js,Dom Events,我正在学习d3，在前面的一个主题中讨论了stopPropagation（）。jasondavies在这里发布了对这个问题的回复和一个例子 在这个例子中，他使用了： .on("mousedown", function() { d3.event.stopPropagation(); }) .on("mousedown.log", log("mousedown circle")) 我不理解事件“mousedown.log”以及它在本例中是如何触发的 以下是jasondavies示例中
stopPropagation（） .on("mousedown", function() { d3.event.stopPropagation(); })
.on("mousedown.log", log("mousedown circle"))
<!DOCTYPE html>
<style>
circle { fill: lightgreen; stroke: #000; }
</style>
<body>
<script src="http://d3js.org/d3.v2.min.js"></script>
<script>
var svg = d3.select("body").append("svg")
.style("float", "left")
.attr("width", 480)
.attr("height", 480)
.on("mousedown", log("mousedown svg"))
.on("mouseup", log("mouseup svg"))
.on("click", log("click svg"));
svg.append("circle")
.attr("cx", 240)
.attr("cy", 240)
.attr("r", 200)
.on("mousedown", function() { d3.event.stopPropagation(); })
.on("mousedown.log", log("mousedown circle"))
.on("mouseup", log("mouseup circle"))
.on("click", log("click circle"))
var div = d3.select("body").append("div")
.style("float", "left")
function log(message) {
return function() {
div.append("p")
.text(message)
.style("background", "#ff0")
.transition()
.duration(2500)
.style("opacity", 1e-6)
.remove();
};
}
</script>
圆圈{填充：浅绿色；笔划：#000；}
var svg=d3.选择（“正文”）.追加（“svg”）
.style（“浮动”、“左”）
.attr（“宽度”，480）
.attr（“高度”，480）
.on（“mousedown”，log（“mousedown svg”））
.on（“mouseup”，log（“mouseup svg”））
。在（“单击”，记录（“单击svg”）；
svg.append（“圆”）
.attr（“cx”，240）
.attr（“cy”，240）
.attr（“r”，200）
.on（“mousedown”，function（）{d3.event.stopPropagation（）；}）
.on（“mousedown.log”，log（“mousedown圈”））
.on（“鼠标悬停”，log（“鼠标悬停圈”））
。在（“点击”，记录（“点击圆圈”））
var div=d3.选择（“主体”）.追加（“div”）
.style（“浮动”、“左”）
功能日志（消息）{
返回函数（）{
附加部分（“p”）
.文本（信息）
.style（“背景”，“#ff0”）
.transition（）
.持续时间（2500）
.样式（“不透明度”，1e-6）
.remove（）；
};
}
mousedown