I want to load a static SVG for a floor plan from my assets, render it to the DOM and then use d3 to modify it to highlight rooms, create tooltips etc. I don't know how I can do this in React at all. You can grab the svg from here https://github.com/hamzanasir/RTCfacilities/blob/master/public/svg/SB-01.svg.
Asked
Active
Viewed 326 times
0
-
you might want to check out this other question / answer. https://stackoverflow.com/questions/4476526/do-i-use-img-object-or-embed-for-svg-files – Jose Jimenez Mar 22 '18 at 01:39
1 Answers
0
I think your SVG file is converted from AutoCAD-like app's *.dwg file.
If you want highlight some elements(eg: path) you need to give them a distinct marker(like id or class attribute) so that the CSS selector or d3 can select them. Unfortunately, the converter tool may not aware that. So you need give them markers manually.
1Cr18Ni9
- 1,737
- 1
- 12
- 21
-
Sorry, I find some ID attributes on some path elements. You can fill a special color to see if it is the room you want highlight. Good luck! – 1Cr18Ni9 Mar 08 '18 at 04:52
-
I think you misunderstood my question. Sorry but I'm asking how can you render an SVG from your assets at all? – Muhammad Hamza Nasir Mar 08 '18 at 04:56
-