Use vertex shader to control arrow size + scaling

[ShrimpCryptid]

Use Case

Spinoff from #469. Currently, the vector arrows need to be recalculated every time the user zooms in or out, or if the vector's scale factor changes. We could use a vertex shader to do this on the fly.

Acceptance Criteria

• Edit VectorField.ts to use a custom fragment shader, and pass uniforms for the scale factor and screen space transforms in.
• Use the vertex shader to scale the arrows based on the provided uniforms.

Details

In a vertex shader you only have access to the one vertex, so I might need to pass in additional data. Consider turning the angle + length of all the vector lines into a LUT/texture that the vertex shader can then read and use to position the arrow heads.

[ShrimpCryptid]

Notes from Dan: for some hints on how to draw a single arrow and instance it, see this thread: https://discourse.threejs.org/t/instancedmesh-lines/13856/2 and maybe some code in simularium-viewer that sets up instancing could help too.

basic high level idea of instancing: you make one buffer with vertices of one single arrow, and another "instance buffer" that has the per-arrow angle, magnitude, etc. Then in your vertex shader you are allowed to index into your instance buffer and get the per-instance data.

example instancing shader in simularium: https://github.com/simularium/simularium-viewer/blob/main/src/visGeometry/rendering/InstancedMeshShader.ts (note that the per-instance data could be anything as long as you can do the right math in your vtx shader - typically you might want it to be small/compact amount of info so it's fast to update)