Selective event handling for SVG overlay demo

This commit is contained in:
Ian Gilman 2014-12-17 17:27:16 -08:00
parent 2ef74836bf
commit 0ab7b956e1

View File

@ -18,7 +18,6 @@
.svg-overlay { .svg-overlay {
left: 0; left: 0;
position: absolute; position: absolute;
pointer-events: none;
top: 0; top: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -69,19 +68,29 @@
}); });
this.viewer.addHandler('open', function() { this.viewer.addHandler('open', function() {
var svg = d3.select(self.viewer.canvas).append("svg") // var svg = document.createElement('svg');
// self.viewer.container.insertBefore(svg, self.viewer.canvas.nextSibling);
var svgD3 = d3.select(self.viewer.container).insert('svg', function() {
return self.viewer.canvas.nextSibling;
})
.attr('class', 'svg-overlay') .attr('class', 'svg-overlay')
.attr("width", $(window).width()) .attr("width", $(window).width())
.attr("height", $(window).height()); .attr("height", $(window).height())
.attr("pointer-events", "none");
self.node = svg.append("g"); self.node = svgD3.append("g");
self.node.append("rect") self.node.append("rect")
.style('fill', '#f00') .style('fill', '#f00')
.attr("x", 0.5) .attr("x", 0.5)
.attr("width", 0.25) .attr("width", 0.25)
.attr("y", 0.5) .attr("y", 0.5)
.attr("height", 0.25); .attr("height", 0.25)
.attr("pointer-events", "fill")
.on("click", function() {
console.log('click', arguments);
});
self.update(); self.update();
}); });