jsx code of svg render inaccurately

[YugdevEm]

i am working on a project where i access a svg image from the user,convert the svgcode of image to jsx in the nodejs server and show the svg image using this jsx in the front end.To do this i need to render the jsxCode inside a react component,the jsxCode is stored inside a variable.The svg image is being rendered inaccurately,the colours are inaccurate and alignment of the text elements are broken.why am i facing this issue?

i also need to make changes to the svg like adding a new path element,change colours of the path etc.

Do any of you know how to fix this?

[TroyAlford]

@YugdevEm I can't give you any advice, there, without seeing the content of your SVG. My guess, however, is that SVG has a set of elements within it that React may not like without alteration. Specifically, this could include namespaces inside the tag names, casing in tags, or things spelled via kebab-case rather than camelCase or PascalCase which React expects.

If you get any errors in your console, I'd suggest starting there. You're also welcome to post the text of your SVG here, if you wish -- I may be able to spot something there.