Directional Tangent 5
This version presents a more complete version of tangent lines.
It builds a line by plotting the tangent points to the siblings through a psuedo center (a "pin" projected out from each point along its bisector direction). This ensures the arc is drawn through the center rather than arcing around the outside, and - importantly - keeps the belt's tangent side selection changing continuously as a point is dragged, rather than snapping between the two inbound tangent sides whenever a point crosses the center-line of its neighbours.
The pin is projected a distance scaled by how sharp the local bend actually
is (bendMagnitude, 0 for a point sitting in a near straight line between
its neighbours, up to 2 for a sharp reversal). Projecting a full radius
regardless of bend sharpness caused the pin offset and the tangent formula's
own radius offset to compound on gentle/near-straight bends, landing the
plotted meeting tips up to a full diameter away from the real point.
The arc sweep direction (resolveArcDirection) still needs a guard for the
near-collinear case: when a point sits (almost) in a straight line between
its neighbours, the two touch points collapse onto nearly the same spot, so
floating point jitter alone shouldn't be allowed to pick the reflex/near-full
loop over the intended near-zero arc.
Meta Data
| title | Directional Tangent 5 |
| imports | () |
| files | ('head', 'stroke', '../point_src/point-content.js', 'pointlist', 'point', '../point_src/tangents.js', '../point_src/bisector.js', '../point_src/math.js', '../point_src/split.js', 'mouse', 'dragging', '../point_src/functions/clamp.js', 'stage', '../point_src/tangents.js', '../point_src/text/beta.js') |
| unused_keys | () |
| unknown_keys | ('categories',) |
| categories | ['tangents', 'bisector', 'raw'] |
| filepath_exists | True |
| path | claude-sonnet-5-pop-edge-directional-tangent-5 |
| filepath | claude-sonnet-5-pop-edge-directional-tangent-5.js |
| clean_files | ('../point_src/core/head.js', '../point_src/setunset.js', '../point_src/stroke.js', '../point_src/compass.js', '../point_src/center.js', '../point_src/point-content.js', '../point_src/pointlistdraw.js', '../point_src/pointlistgradient.js', '../point_src/pointlistshape.js', '../point_src/pointlistgenerator.js', '../point_src/unpack.js', '../point_src/pointlist.js', '../point_src/pointlistpen.js', '../point_src/pointpen.js', '../point_src/pointdraw.js', '../point_src/relative-xy.js', '../point_src/pointcast.js', '../point_src/point.js', '../point_src/tangents.js', '../point_src/bisector.js', '../point_src/math.js', '../point_src/functions/clamp.js', '../point_src/split.js', '../point_src/events.js', '../point_src/automouse.js', '../point_src/distances.js', '../point_src/protractor.js', '../point_src/text/beta.js', '../point_src/dragging.js', '../point_src/stage-hooks.js', '../point_src/stage-resize.js', '../point_src/functions/resolve.js', '../point_src/stage.js') |