Function to convert control points from absolute coordinates to edge relative coordinates

[EliotRagueneau]

Hi everyone,

I've struggled a bit to develop this function so I thought that it might be of some interest to other users.
Basically it's use case is for when you have an edge with some control points (segments, bezier, etc), but you have absolute coordinates and not the cytoscape required edge relative coordinates.

import {array} from "vectorious";

/**
 * Use Matrix power to convert points from an absolute coordinate system to an edge relative system
 *
 * Visually explained by https://youtu.be/kYB8IZa5AuE?si=vJKi-MUv2dCRQ5oA<br>
 * Short version ==> https://math.stackexchange.com/q/1855051/683621
 * @param source Position position of the edge source:  {x:number, y:number}
 * @param target Position position of the edge target:  {x:number, y:number}
 * @param toConvert Array of Position to convert to the edge-relative system
 * @return The points converted to relative coordinates {distances: number[], weights: number[]}
 */
function absoluteToRelative(source: Position, target: Position, toConvert: Position[]): RelativePosition {
  const relatives: RelativePosition = {distances: [], weights: []};
  if (toConvert.length === 0) return relatives;

  const mainVector = array([target.x - source.x, target.y - source.y]); // Edge vector
  const orthoVector = array([-mainVector.y, mainVector.x]) // Perpendicular vector
    .normalize(); //Normalized to have the distance expressed in pixels https://math.stackexchange.com/a/413235/683621
  let transform = array([
    [mainVector.x, mainVector.y],
    [orthoVector.x, orthoVector.y],
  ]).inv(); // Should always be invertible if the ortho vector is indeed perpendicular

  for (let coord of toConvert) {
    const absolute = array([[coord.x - source.x, coord.y - source.y]]);
    const relative = absolute.multiply(transform);
    relatives.weights.push(relative.get(0, 0))
    relatives.distances.push(relative.get(0, 1))
  }

  return relatives;
}

type Position = { x:number, y:number };
type RelativePosition = { distances: number[], weights: number[] };

Here i'm using package [email protected] to facilitate all the required matrix and vectors manipulation

[maxkfranz]

Great. If we were to add absolute coordinates as a builtin feature, a lot of calculations (like the inverse normal vector) are already calculated in the lib. So, the translation from the above code into the lib wouldn't be too onerous.