Solve for Initial Conditions

The g9 library will adjust algorithmic drawings such that any element can be moved. When someone interacts with the graphics, for example by trying to drag an element to a new position, g9 optimizes over the space of possible values for your data to find a set of values that comes closest to creating the change. From MIT. post

The library will render an image from initial conditions and algorithm. When any part of the generated image is moved, the library asks, what minimal adjustment to initial conditions will result in the revised drawing arriving at the new point.

var initialData = { x: 10, y: 0 } var render = function(data, ctx){ ctx.point(data.x, data.y) ctx.point(data.y, data.x) } g9(initialData, render) .align('center', 'center') .insertInto('#demo-basic')

Buried in the library is a gradient descent solver that runs the calculations in a blink of an eye. github

Gradient descent is a first-order iterative optimization algorithm. To find a local minimum of a function using gradient descent, one takes steps proportional to the negative of the gradient (or of the approximate gradient) of the function at the current point. wikipedia


Regarding an unrelated StrangeLoop presentation Bret Victor says, Pay particular attention to how direct manipulation works by backsolving for variable values w/ numerical minimization. twitter site video