A simple example showing how to detect a double tap with d3.js, and an accompanying method for reusability.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<style>
div {
position: absolute;
height:300px;
width:300px;
border:2px solid #000;
text-align: center;
line-height: 300px;
}
</style>
</head>
<body>
<div>Double tap inside the box</div>
<script src="//d3js.org/d3.v3.min.js"></script>
<script type="text/javascript">
d3.selection.prototype.dblTap = function(callback) {
var last = 0;
return this.each(function() {
d3.select(this).on("touchstart", function(e) {
if ((d3.event.timeStamp - last) < 500) {
return callback(e);
}
last = d3.event.timeStamp;
});
});
}
d3.select("div").dblTap(function() {
alert("Double tap!");
});
</script>
</body>
</html>