Ray Sphere Intersection Kenwright img style outline 0 box shadow none border 0 margin 0 padding 0 src https notebook xbdev net var images imgqrZhGY3enLBl jpg img document body style min height 300px let ww 300 let wh 300 let svg document createElementNS http www w3 org 2000 svg svg svg setAttributeNS null width ww svg setAttributeNS null height wh svg setAttributeNS null fill currentColor svg style border 1px solid blue document body appendChild svg function addCircle c r id col green var newCircle document createElementNS http www w3 org 2000 svg circle newCircle id id newCircle setAttribute cx c x newCircle setAttribute cy c y newCircle setAttribute r r newCircle setAttribute fill transparent newCircle setAttribute stroke width 2 newCircle setAttribute stroke col svg appendChild newCircle addCircle x 200 y 100 50 c0 let shapes shapes push c x 160 y 110 r 50 id c0 type circle shapes forEach s addCircle s c s r s id function setLine id s e opt let i0 document getElementById id if i0 null i0 document createElementNS http www w3 org 2000 svg line i0 id id var randomColor Math random 0xFFFFFF 0 toString 16 let rbyte return Math floor Math random 256 256 let randomColor rgb rbyte rbyte rbyte i0 setAttribute stroke randomColor svg appendChild i0 i0 setAttribute x1 s x i0 setAttribute y1 s y i0 setAttribute x2 e x i0 setAttribute y2 e y if typeof opt undefined Object entries opt forEach o const k v o i0 setAttribute k v function sub a b return x a x b x y a y b y function add a b return x a x b x y a y b y function dist a b return Math sqrt a x b x a x b x a y b y a y b y function norm a let d Math sqrt a x a x a y a y return x a x d y a y d function len a return Math sqrt a x a x a y a y function scale a s return x a x s y a y s function dot a b return a x b x a y b y function lineIntersectCircle line circle const s line s const e line e const r circle r const c circle c let tsc len sub s c let tec len sub e c if tsc r tec r inside sphere console log both s and e inside sphere return hit false let inside false if tec r inside true let d0 dist line s circle c let d1 dist line e circle c let d0inside d0 circle r let d1inside d1 circle r let nse norm sub e s let vsc sub c s let to dot nse vsc let th len vsc let ta Math sqrt th th to to if ta r missed sphere console log ray misses sphere return hit false let tpa Math sqrt r r ta ta let t to tpa if tsc r start inside the sphere t to tpa let tse len sub e s if t 0 t tse greater than length of line return hit false let p add s scale nse t let n norm sub p c return hit true normal n hitpoint p pen tse t dir nse inside inside id l0 s x 253 y 148 e x 338 y 160 let line id l0 s x 253 y 148 e x 338 y 160 setLine line id line s line e let res lineIntersectCircle line shapes 0 if res hit console log hit addCircle res hitpoint 5 c2 black console log ready document body style min height 300px let ww 300 let wh 300 let svg document createElementNS http www w3 org 2000 svg svg svg setAttributeNS null width ww svg setAttributeNS null height wh svg setAttributeNS null fill currentColor svg style border 1px solid blue document body appendChild svg function addCircle c r id col green let newCircle document getElementById id if newCircle null newCircle document createElementNS http www w3 org 2000 svg circle newCircle id id svg appendChild newCircle newCircle setAttribute cx c x newCircle setAttribute cy c y newCircle setAttribute r r newCircle setAttribute fill transparent newCircle setAttribute stroke width 2 newCircle setAttribute stroke col addCircle x 200 y 100 50 c0 let shapes shapes push c x 160 y 110 r 50 id c0 type circle shapes forEach s addCircle s c s r s id function setLine id s e opt let i0 document getElementById id if i0 null i0 document createElementNS http www w3 org 2000 svg line i0 id id var randomColor Math random 0xFFFFFF 0 toString 16 let rbyte return Math floor Math random 256 256 let randomColor rgb rbyte rbyte rbyte i0 setAttribute stroke randomColor svg appendChild i0 i0 setAttribute x1 s x i0 setAttribute y1 s y i0 setAttribute x2 e x i0 setAttribute y2 e y if typeof opt undefined Object entries opt forEach o const k v o i0 setAttribute k v function sub a b return x a x b x y a y b y function add a b return x a x b x y a y b y function dist a b return Math sqrt a x b x a x b x a y b y a y b y function norm a let d Math sqrt a x a x a y a y return x a x d y a y d function len a return Math sqrt a x a x a y a y function scale a s return x a x s y a y s function dot a b return a x b x a y b y function lineIntersectCircle line circle const s line s const e line e const r circle r const c circle c let tsc len sub s c let tec len sub e c if tsc r tec r inside sphere console log both s and e inside sphere return hit false let inside false if tec r inside true let d0 dist line s circle c let d1 dist line e circle c let d0inside d0 circle r let d1inside d1 circle r let nse norm sub e s let vsc sub c s let to dot nse vsc let th len vsc let ta Math sqrt th th to to if ta r missed sphere console log ray misses sphere return hit false let tpa Math sqrt r r ta ta let t to tpa if tsc r start inside the sphere t to tpa let tse len sub e s if t 0 t tse greater than length of line return hit false let p add s scale nse t let n norm sub p c return hit true normal n hitpoint p pen tse t dir nse inside inside let line id l0 s x 20 y 100 e x 200 y 100 setLine line id line s line e function check setLine line id line s line e let res lineIntersectCircle line shapes 0 if res hit console log line addCircle res hitpoint 5 c2 black else addCircle x 1000 y 1000 5 c2 black check onmousemove e let mp x e clientX y e clientY line e mp check onclick e let mp x e clientX y e clientY line s mp line e add mp x 10 y 10 check console log ready
00 svg svg svg setAttributeNS null width ww svg setAttributeNS null height wh svg setAttributeNS null fill currentColor svg style border 1px solid blue document body appendChild svg function addCircle c r id col green let newCircle document getElementById id if newCircle null newCircle document createElementNS http www w3 org 2000 svg circle newCircle id id svg appendChild newCircle newCircle setAttribute cx c x newCircle setAttribute cy c y newCircle setAttribute r r newCircle setAttribute fill transparent newCircle setAttribute stroke width 2 newCircle setAttribute stroke col addCircle x 200 y 100 50 c0 let shapes shapes push c x 160 y 110 r 50 id c0 type circle shapes forEach s addCircle s c s r s id function setLine id s e opt let i0 document getElementById id if i0 null i0 document createElementNS http www w3 org 2000 svg line i0 id id var randomColor Math random 0xFFFFFF 0 toString 16 let rbyte return Math floor Math random 256 256 let randomColor rgb rbyte rbyte rbyte i0 setAttribute stroke randomColor svg appendChild i0 i0 setAttribute x1 s x i0 setAttribute y1 s y i0 setAttribute x2 e x i0 setAttribute y2 e y if typeof opt undefined Object entries opt forEach o const k v o i0 setAttribute k v function sub a b return x a x b x y a y b y function add a b return x a x b x y a y b y function dist a b return Math sqrt a x b x a x b x a y b y a y b y function norm a let d Math sqrt a x a x a y a y return x a x d y a y d function len a return Math sqrt a x a x a y a y function scale a s return x a x s y a y s function dot a b return a x b x a y b y function lineIntersectCircle line circle const s line s const e line e const r circle r const c circle c let tsc len sub s c let tec len sub e c if tsc r tec r inside sphere console log both s and e inside sphere return hit false let inside false if tec r inside true let d0 dist line s circle c let d1 dist line e circle c let d0inside d0 circle r let d1inside d1 circle r let nse norm sub e s let vsc sub c s let to dot nse vsc let th len vsc let ta Math sqrt th th to to if ta r missed sphere console log ray misses sphere return hit false let tpa Math sqrt r r ta ta let t to tpa if tsc r start inside the sphere t to tpa let tse len sub e s if t 0 t tse greater than length of line return hit false let p add s scale nse t let n norm sub p c return hit true normal n hitpoint p pen tse t dir nse inside inside let line id l0 s x 20 y 100 e x 200 y 100 setLine line id line s line e function check setLine line id line s line e let res lineIntersectCircle line shapes 0 if res hit console log line addCircle res hitpoint 5 c2 black else addCircle x 1000 y 1000 5 c2 black check onmousemove e let mp x e clientX y e clientY line e mp check onclick e let mp x e clientX y e clientY line s mp line e add mp x 10 y 10 check console log ready