Supplies are limited. Contact info@espc.tech right away to save your spot before the conference sells out.
Get your discountScore big with last-minute savings on the final tickets to FabCon Vienna. Secure your discount
Hi -
Question about the Shape Map:
* I created a map of a building layout/floor plan - different rooms so to speak - using Adobe Illustrator. I saved the file as a "SVG" file.
I noticed in the shape map visualization that if you use a 'custom map' it needs to be a .json file.
Is there anyway to convert the .svg file (again a floor plan of a building) into a .json file that inturn, can be used by the shape map visualization ?
Any thoughts would be appreciated - Thanks - Jerry
-
Hi @jerryr125 ,
Thank you for reaching out to the Microsoft Community Forum.
Hi @Jai-Rathinavel , @Royel , @Ilgar_Zarbali , Thank you for your prompt responses.
Hi @jerryr125 , Could you please try the proposed solutions shared by @Jai-Rathinavel , @Royel and @Ilgar_Zarbali . Please do let us know if you have any further queries.
Regards,
Dinesh
Hi @jerryr125 ,
We haven’t heard from you on the last response and was just checking back to see if you have a resolution yet. And, if you have any further query do let us know.
Regards,
Dinesh
Great question, Jerry! Short answer: Shape Map needs TopoJSON (or GeoJSON converted to TopoJSON). An SVG floor plan can’t be used directly—it must be turned into polygons with a name/key for each room.
I kindly invite you to read my newsletter article about Shape Map:
https://www.linkedin.com/pulse/developing-azerbaijan-shape-map-azepowerbicommunity-538te/?trackingId...
Fastest path (recommended)
Use Synoptic Panel (custom visual by OKViz) — it’s made for floor plans and works directly with SVG. Give each room a unique ID in Illustrator, export SVG, then bind measures by room ID. No JSON conversion needed.
If you must use Shape Map
Pipeline to convert your SVG → TopoJSON:
- Make each room a closed polygon (no strokes-only).
- Give every room a unique Name/ID (e.g., “Room101”).
- File → Export → DXF (rooms as filled polygons).
- Add the DXF as a vector layer.
- If needed, run Polygonize to convert lines to polygons.
- Add an attribute name (matching Room IDs).
- Right-click layer → Export → GeoJSON.
- Use mapshaper (GUI or CLI):
mapshaper rooms.geojson -clean -simplify 5% keep-shapes -o format=topojson rooms.json
- Ensure each feature has a "name" property.
- Visual → Shape map → Custom map → import rooms.json.
- Bind your data’s Location column to the name property.
I hope it wil help
Hi @jerryr125
There are pleanty of online tools available to convert your SVG into TopoJson. You can try these
Find this helpful? ✔ Give a Kudo • Mark as Solution – help others too!
Hi @jerryr125 Please check if this SVGtoTopoJson repo https://github.com/PBIZeroZ/SVGtoTopoJson
and see if it helps.
Thanks,
Jai
Proud to be a Super User! | |