plotly / plotly/plotly.js

[BUG]: The `quiver` trace ignores a discrete `marker.color` array and results in every arrow being black

Open
#8,026 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug P2 size: 3
Dominant language
JavaScript
Stars
18.3k
Forks
2k
Avg merge
2d 12h
Merged PRs (30d)
28

Description

Description

The quiver trace ignores a discrete marker.color array. Every arrow ends up black instead of taking its per-point color. A numeric array with a colorscale works, and a single color string works.

Screenshots/Video
No colorscale (the bug) With colorscale (for comparison)
Image Image
Steps to reproduce
  • Open plotly devtools
  • Run the following snippet in the browser devtools console
     Plotly.newPlot(gd, [{
       type: 'quiver',
       x: [1, 2, 3], y: [1, 2, 3],
       u: [1, 1, 1], v: [0, 1, 0],
       marker: { color: ['rgb(23, 103, 194)', '#FF4136', '#2ECC40'], line: { width: 3 } }
     }]);
    
  • Note that all three arrows are rgb(0, 0, 0) (by inspection of using your eyes)
  • Run the following modified snippet:
     Plotly.newPlot(gd, [{
       type: 'quiver',
       x: [1, 2, 3], y: [1, 2, 3],
       u: [1, 1, 1], v: [0, 1, 0],
       marker: { color: [0, 5, 10], line: { width: 3 } },
       colorscale: 'Viridis'
     }]);
    
  • Note that the arrows have the correct color
Notes
  • marker.color is documented as arrayOk, so the black arrows seem to be a rendering bug (rather than an unsupported input)
  • Per the schema, each arrow should be drawn as its own color from the array. If this behavior is intentional, we should update the description.
  • This was found while working on #8025

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the issue through the Plotly.newPlot calls in the browser devtools, starting with the quiver trace implementation. Compare handling of the discrete marker.color array with the numeric colorscale case, then verify that each arrow uses its corresponding color while single colors and colorscales continue to work.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
data-visualization
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Active
Clarity
Clearly specified
Newbie friendliness
72/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.