Draw Arrow Lines
Click on the SVG drawing to set the start point of a line. This will place the line in ThreeJS and track the cursor until the end point of the line is clicked on the SVG drawing. Start another line after the second point of the previous line has been set.

The SVG drawing overlays the ThreeJS canvas. You can toggle the SVG overlay visibility by selecting the 'Close SVG/Open SVG' button. When the SVG is closed the ThreeJS canvas is available for mousewheel/cursor control via the OrbitControls feature. The default view is CSS2DRenderer (SVG 2D) where the SVG arrow lines remains fixed. You can select 'SVG 3D' button to place the SVG arrow lines into the CSS3DRenderer where it will take on the perspective of the 3D environment.

SVG Source:

ThreeJS SVG Source:

Javascript SVG:

Javascript ThreeJS: