Untitled

<body>
   <img src="image.svg" width="600" height="600" />
   <svg width="1500" height="650"/>
</body>

function example(event, bounding) {
  // TODO: review this hack
  var magicYOffset = 600;

  var y = event[1];
  var top = bounding.top - magicYOffset;
  var bottom = bounding.bottom - magicYOffset;

  // TODO: do something with the new top and bottom
  return ???;
}

d3.drag()
  .on('start', function (d) {
    var event = d3.touch(this) || d3.mouse(this);
      clickX  = event[0];
      clickY  = event[1];
      cursorX = event[0];
      cursorY = event[1];

      var boundingRect = this.getBoundingClientRect();

      var flag = example(event, boundingRect);
      ...