Как использовать dragBoundFunc для Polygon в React Konva

Question

Я хочу связать свое движение многоугольника с изображением в React Konva. Когда я двигаю полигон, он выходит из изображения, которое мне не нужно. Я ограничиваю движение в onDragEnd, но это не оптимально. Я пытался использовать dragBoundFunc, но он не работает должным образом. Я использовал dragBoundFunc, но он не работает, как я хотел. Пожалуйста, помогите мне понять, что я могу сделать.

  handlePolygonDragEnd (e) {

      // Calculating new Position of Points
      for (var i = 0; i < polygon.points.length; i++) {
        polygon.points[i].cx += e.target._lastPos.x - 1;
        polygon.points[i].cy += e.target._lastPos.y - 1;
        polygon.points[i].radius = 3;

        // Bounding the draw of Polygon
        if (polygon.points[i].cx < 0) {
          for (var k = 0; k < polygon.points.length; k++) {
            var distance = Math.abs(polygon.points[i].cx - polygon.points[k].cx);

            if (k === i) {
              continue;
            }

            polygon.points[k].cx = distance;
          }
          polygon.points[i].cx = 1.5;
        }

        if (new_polygon_list[ind].points[i].cy < 0) {
          for (var k = 0; k < polygon.points.length; k++) {
            var distance = Math.abs(polygon.points[i].cy - polygon.points[k].cy);

            if (k === i) {
              continue;
            }

            polygon.points[k].cy = distance;
          }
          polygon.points[i].cy = 1.5;
        }

        if (polygon.points[i].cx > this.props.width) {
          for (var k = 0; k < polygon.points.length; k++) {
            var distance = Math.abs(polygon.points[i].cx - polygon.points[k].cx);

            if (k === i) {
              continue;
            }

            polygon.points[k].cx = this.props.width - distance;
          }
          polygon.points[i].cx = this.props.width - 1.5;
        }

        if (polygon.points[i].cy > this.props.height) {
          for (var k = 0; k < polygon.points.length; k++) {
            var distance = Math.abs(polygon.points[i].cy - polygon.points[k].cy);

            if (k === i) {
              continue;
            }

            polygon.points[k].cy = this.props.height - distance;
          }
          polygon.points[i].cy = this.props.height -1.5;
        }
      }

      this.setState ({polygon});
  }

             <Line
                points={this.state.points}
                closed
                onDragEnd={this.props.DragEnd}
                dragBoundFunc={() => {
                    var points;
                    points = this.props.pointerss;

                    for (var i = 0; i < points; i += 2) {
                        if (points[i] < 0) {
                            points[i] = 0;
                        }

                        if (points[i+1] < 0) {
                            points[i+1] = 0;
                        }
                    }

                    return {
                        points : points,
                    }
                }}
                />