 
   endDrawCurve: (evt) ->
     if @drawing
+      document.removeEventListener 'mousemove', @drawCurve
       @drawing = false
       #update relation with custom data
       @updateRelationCustomData(@state.currentData)
 
   pointToScaledCoords: (evt) ->
-    rect = evt.target.getBoundingClientRect()
+    rect = this.refs.graphBody?.getBoundingClientRect()
     coords = {x: rect.width - (rect.right-evt.clientX), y: rect.bottom - evt.clientY}
     scaledCoords = {x: Math.round(coords.x / rect.width * 100), y: Math.round(coords.y / rect.height * 100)}
     scaledCoords

  startDrawCurve: (evt) ->
    # can only draw on custom relationships
    if @state.canDraw
      @drawing = true
      if @state.newCustomData
        scaledCoords = @pointToScaledCoords(evt)

      (div
        className: drawClass
        onMouseDown: @startDrawCurve
        onMouseUp: @endDrawCurve
        ref: "graphBody"
        ,
        if @state.newCustomData
          (div {className: 'graph-hint'},
