uber/react-vis

Allow legend to be "selected" from a property/class/state.

Open

#770 opened on Mar 29, 2018

View on GitHub
 (2 comments) (0 reactions) (0 assignees)JavaScript (8,615 stars) (868 forks)batch import
enhancementhelp wanted

Description

I want to be able to control the legend ( active/hovered item ) using react or redux state.

This task is simple with AreaSeries, and I suspect much of the Series components as well.

I cannot find a way to do this for the legend, and if there is one I must have missed it.

The only work around I've been able to control is if I pass react components into the items property and control their style with state, but I cannot make it uniform to the actual hovering of the component, since I cannot control anything outside of the passed in component without investigating DOM manipulation.

Contributor guide

Tech stack
reactjavascript
Domain
frontend
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
half day
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
mostly clear
Prerequisites
Reactreact vis basics
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
40
Research direction
Investigate how the Legend component currently handles active/hovered state. Look at the AreaSeries implementation for reference on how it exposes state via props. Check the Legend source code in the repository (likely in src/plot/legend/) and identify where state management is handled. Consider adding a new prop (e.g., `selectedItem`) to allow external control, similar to how other series components work. Review the issue comments for any additional clarification.