Add quiver trace type for vector field visualization

[degzhaus]

Overview

This PR adds a new quiver trace type to Plotly.js for visualizing 2D vector fields using arrows.

Continuation of #7584

Features

• Vector positioning: Arrows placed at x, y coordinates with direction/magnitude from u, v components
• Sizing modes: scaled (normalized), absolute, or raw vector lengths via sizemode/sizeref
• Arrow anchoring: Position arrows by tail, tip, or center/cm/middle
• Colorscale support: Color arrows by magnitude or custom scalar field (c array)
• Styling: Configurable line color, width, dash patterns via line.* attributes
• Arrowhead sizing: Adjustable arrowhead size via arrowsize
• Full interactivity: Hover support with customizable hovertemplate, point selection
• Animation support: Animatable x, y, u, v, and c arrays

API

Plotly.newPlot('div', [{
  type: 'quiver',
  x: [0, 1, 2],
  y: [0, 1, 2],
  u: [1, 0, -1],  // x-component of vectors
  v: [0, 1, 0],   // y-component of vectors
  sizemode: 'scaled',  // 'scaled' | 'absolute' | 'raw'
  sizeref: 0.5,
  anchor: 'tail',  // 'tail' | 'tip' | 'center'
  colorscale: 'Viridis',
  line: { width: 2 }
}]);

Screenshots

Examples taken from plotly.com/python/quiver-plots

Gist with example code

Basic Quiver Plot

With Colorscale

Testing

• ✅ Jasmine unit tests
• ✅ 9 visual regression test mocks

Files Changed

New files (src/traces/quiver/)

• index.js - Trace module definition
• attributes.js - Attribute schema
• defaults.js - Default value handling
• calc.js - Data calculation
• plot.js - SVG rendering
• style.js - Styling
• hover.js - Hover behavior
• select_points.js - Selection support
• event_data.js - Event data formatting
• format_labels.js - Label formatting

Modified

• lib/index.js & lib/index-strict.js - Build integration

Tests

• test/jasmine/tests/quiver_test.js - Unit tests
• test/image/mocks/quiver_*.json - 9 mock files
• test/image/baselines/quiver_*.png - Baseline images

[degzhaus]

Thanks again for the great comments, @emilykl !

I will attempt to reference commits inline from this comment here:
#7584 (comment)

-- Bug Fixes --

"The axis ranges don't automatically adjust to include the full length of the arrows" fixed here:
96845a8

"Colorscale seems broken in the latest version" fixed here:
3cd525c

"Legends are missing icons" fixed here:
6a37260

"selected and unselected styling options" fixed here:
96bb82c

"The text property also seems broken in the latest iteration" fixed here:
69516db

"Display of colorbars does not seem to work" fixed here:
b19cce2

-- API Refinements --

"c should become marker.color" fixed here:
3cd525c

"The line options should be nested under marker.line",
"Move arrowheadsize under marker so that it becomes marker.arrowheadsize",
"No need for duplicate arrowwidth property",
"arrow_scale should be removed as well" all fixed here:
c7f073d

[degzhaus]

Here are the followups for the remaining 3 comments from: #7584, @emilykl :

"Could we plausibly reuse the src/traces/scatter/select.js selectPoints() function" fixed here:
4f91255

"Should probably call the hasColorscale() function here" fixed here:
82e6bc1

"Can you look into whether we can/should use the handleXYDefaults() function here" fixed here:
7135b52

[degzhaus]

Alrighty, @emilykl , thanks again for your great feedback and patience as I addressed it!

I have pushed all my fixes and tested locally, I think we're close 🤞