diff --git a/D3.md b/D3.md index 9131c8a..e2fe4f6 100644 --- a/D3.md +++ b/D3.md @@ -219,13 +219,16 @@ use `d3.event.stopPropagation();` when events conflict ### Dragging ```javascript -var drag = d3.behavior.drag() - .on('dragstart', dragStart) +//create the behavior +var drag = d3.drag() + .on('start', dragStart) .on('drag', drag) - .on('dragend', dragEnd); -//.... -dotsGroup.call(drag); + .on('end', dragEnd); +//... +//apply it to a selection +d3.selectAll('circle').call(drag); //.... +//define callbacks function dragStart(d){ //d is the data for the dragged object d3.select(this); //the visual object d3.event.x; //x position of cursor @@ -233,6 +236,8 @@ function dragStart(d){ //d is the data for the dragged object } ``` +You can use the xScale.invert and yScale.invert to get data from d3.event.x and d3.event.y + ### Zooming ```javascript @@ -248,9 +253,6 @@ function zoomed(){ } ``` -You can use the xScale.invert and yScale.invert to get data from d3.event.x and d3.event.y - - ## Basic Layouts - https://github.com/d3/d3/wiki/Plugins - http://c3js.org/