uber/react-vis

getX/Y doesn't work with cluster and stackBy

Open

#854 ouverte le 3 juil. 2018

Voir sur GitHub
 (1 commentaire) (0 réactions) (0 assignés)JavaScript (8 615 stars) (868 forks)batch import
bughelp wanted

Description

Starting with the cluster/stackBy example here: https://github.com/uber/react-vis/blob/master/showcase/plot/clustered-stacked-bar-chart.js

When you add getX and getY to the XYPlot it breaks the render of the chart. Basically only the first "cluster" renders for some reason.

See Codesandbox repo: https://codesandbox.io/s/5wq4wqml1p

Console error on render: react-vis bug - codesandbox 2018-07-03 14-27-43

Guide contributeur

Stack technique
javascriptreact
Domaine
frontend
Type d'issue
bug
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
3
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
1-3 hours
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
stale
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
needs investigation
Prérequis
basic reactreact vis basicsbar chart concepts
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
25
Direction de recherche
Reproduce the bug using the provided CodeSandbox (https://codesandbox.io/s/5wq4wqml1p) which is based on the clustered stacked bar chart example. Notice the console error on render. Investigate how getX and getY properties are handled in the XYPlot component when cluster and stackBy are used. Look at the source code of XYPlot and related components (e.g., VerticalBarSeries, Cluster, Stack) to understand why only the first cluster renders. Check if there is a missing data mapping or conflicting attribute handling. The issue has low activity, so consider starting by replicating the setup and isolating the problem in a minimal example.