Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

"Dom-less" start for just generating result svg [Enhancement] #693

Open
pid0r-3blan opened this issue Feb 8, 2023 · 1 comment
Open

Comments

@pid0r-3blan
Copy link

Is your feature request related to a problem? Please describe.
I'm trying to find a way to use Two.js in react-native because we want to reuse existing renders from our web app. I saw this issue #159, but want to try another way.

In RN there's a package https://github.com/software-mansion/react-native-svg and despite the fact that it does not implement all the features of svg, we can at least try. So the problem I have is that I probably need to attach to some DOM element to start using Two.js instance, but of course there's no web-DOM in RN. So I'm wondering if there's a way to get a resulting svg structure, but without trying to render it to DOM (I called it "dom-less" render)? I have static renders without animations, so I need to get only first state of the render. Then I can try to translate it to react-native-svg components.

Could you give me a hint?

@jonobr1
Copy link
Owner

jonobr1 commented Feb 8, 2023

Good question. In Two.js you can pass an element to a new instantiation:

const two = new Two({
  domElement: svgElement
});

An SVG element could be retrieved (possibly) through the useRef function in React to set svgElement to a valid SVG element.

Unfortunately, based on a preliminary look at how react-native-svg works, this won't be completely helpful because you need to supply the SVG architecture to Two.js. Two.js is a web-based library and expects to use the document to create all of its SVG elements (when using the SVG Renderer). There currently isn't a feature like the node.js / canvas rendering to do headless renders with Two.js in SVG. Though this would be a spiffy addition to the library.

Let's leave this issue open so I can explore it further. Sorry can't be more helpful.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants