plotly / plotly/react-plotly.js
React-plotly Svg transform
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 1.1k
- Forks
- 138
- Avg merge
- 3d 2h
- Merged PRs (30d)
- 4
Description
I'm trying to use react-plotly inside a foreign object within an Svg, this works fine as shown here.
https://codepen.io/anon/pen/eyYjgr
However I would like to move this object using a transform.
<foreignObject id={"TestSvgFO"} width="100%" height="100%"
transform="translate(150, 0)"
xmlns="http://www.w3.org/2000/svg">
This results in sliding the view window off the plotly graph instead of moving it.
https://codepen.io/anon/pen/qpByMe
Any suggestions on a way to get it to move correctly in an Svg object with a transform?
(edited your links so they work - alexcjohnson)
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reproducing the behavior in the two linked CodePen examples, comparing the working foreignObject case with the transformed case. Trace how react-plotly behaves inside the SVG foreignObject and determine whether the reported viewport shift is expected or a bug; done means documenting or validating a confirmed way for the plot to move with the transform.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- data-visualization, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100