Объясните как гнуть svg слои с помощью js кода?

Я нашел библиотеку warp.js которая позволяет гнуть svg файлы. Но я так и не понял как это сделать в документаций есть только два примера и общее описание функций. https://github.com/benjamminf/warpjs Как в

 const svg = document.getElementById('svg-element')
 const warp = new Warp(svg)

 warp.interpolate(4)
 warp.transform(([ x, y ]) => [ x, y + 4 * Math.sin(x / 16) ])

установить свои значения а если точнее то Я просто хочу создать массив опорных точек с параметрами

arr = [
  [x=0,y=0,r=10,p=10, n[x=10,y=10]],
  [x=10,y=10,r=10,p=10, n[x=10,y=10]]
]

где x=положение по вертикали, y=положение по горизонтали, r=радиус воздействия p=жесткость воздействия n=направление движения по которому идет воздействие

Если установлена другая статична опорная точка то она будет удерживать часть фигуры на своем месте. Примерно как в марионеточной деформаций(Puppet Warp)

Кто нибудь может мне объяснить по какому принципу код работает

особенно мне не понятно что находится внутри X и Y и как я должен ориентироваться что бы исказить свой svg файл как мне нужно.

Я не очень хорош в геометрии поэтому можете объяснить как можно подробнее.