victory icon indicating copy to clipboard operation
victory copied to clipboard

Voronoi Container in VictoryGroup doesn't work, otherwise works fine

Open clemwo opened this issue 1 month ago • 0 comments

Is there an existing issue for this?

  • [X] I have searched the existing issues

Code of Conduct

  • [X] I agree to follow this project's Code of Conduct

Victory version

37.0.2

Code Sandbox link

https://codesandbox.io/p/sandbox/victory-v35-0-3-works-forked-qzs33q?file=%2Fsrc%2FApp.js

Bug report

Hi, thanks for the great work.

I would like to have a voronoi container around specific line graphs in my chart component. The voronoi container should only react to that and not other line graphs in my chart.
After doing some research I figured that this case is perfect for the VictoryGroup.
My idea was simply grouping the line graphs that should be handled by the VoronoiContainer in a VictoryGroup.

However that doesn't work and I can't figure out why.

Steps to reproduce

Please check the sandbox [here](https://codesandbox.io/p/sandbox/victory-v35-0-3-works-forked-qzs33q?file=%2Fsrc%2FApp.js)

The code looks like this:


<div className="App">
      <VictoryChart>
        <VictoryAxis />
        <VictoryAxis dependentAxis />
        {/* If I put the VictoryVoronoiContainer in the VictoryChart component a few lines above everything works fine */}
        <VictoryGroup
          containerComponent={
            <VictoryVoronoiContainer labels={({ datum }) => getLabel(datum)} />
          }
        >
          <VictoryLine data={secondLine} style={{ data: { stroke: "red" } }} />
          <VictoryLine data={firstLine} style={{ data: { stroke: "blue" } }} />
        </VictoryGroup>
        {/* I dont want this line to be included in the voronoi container */}
        <VictoryLine x={() => 5} style={{ data: { strokeWidth: 0.5 } }} />
      </VictoryChart>
    </div>


### Expected behavior

```markdown
As specified in the docs, the voronoi should work as a container element for VictoryGroup as described in the docs [here](https://commerce.nearform.com/open-source/victory/docs/victory-group#containercomponent)

Actual behavior

No label is being shown and the events don't seem to be triggered.

Environment

- Device: Macbook Air M2
- OS: MacOS Ventura 13.0
- Node: 18.16.1
- Browser: Firefox

clemwo avatar May 22 '24 14:05 clemwo