Position Widget Control:

This app lets you position widgets according to a curve's high low fluctuation. Implemented with D3.js and Jquery.

How to use:

Change the chart length, widget length, default spacing, and minimum spacing values in the input boxes.
Click the "Set All Widgets" button to initialize all widget positions.
Click "Re-Generate Curve" button to genearate another random curve.
Click one of the widgets to select it. The widget turn green when selected.
Hold the mouse and drag to move a widget along the X axis. When the widget is moving it's pink.
The "Delete", "AddLeft", "AddRight" button let you delete/add more widgets relative to current selected widget.