Forum Discussion
Power BI - Shape Map Visualization Question
- 11 months ago
Hi jerryr125 Please check if this SVGtoTopoJson repo https://github.com/PBIZeroZ/SVGtoTopoJson
and see if it helps.
Thanks,
Jai
- 11 months ago
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=01vDiddzTUS%2FT7%2FyqKQLIg%3D%3DFastest 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:
- Prep in Illustrator
- Make each room a closed polygon (no strokes-only).
- Give every room a unique Name/ID (e.g., “Room101”).
- Export to DXF
- File → Export → DXF (rooms as filled polygons).
- Bring into QGIS (free)
- Add the DXF as a vector layer.
- If needed, run Polygonize to convert lines to polygons.
- Add an attribute name (matching Room IDs).
- Export GeoJSON
- Right-click layer → Export → GeoJSON.
- Convert to TopoJSON
- 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.
- Power BI Shape Map
- Visual → Shape map → Custom map → import rooms.json.
- Bind your data’s Location column to the name property.
I hope it wil help
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=01vDiddzTUS%2FT7%2FyqKQLIg%3D%3D
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:
- Prep in Illustrator
- Make each room a closed polygon (no strokes-only).
- Give every room a unique Name/ID (e.g., “Room101”).
- Export to DXF
- File → Export → DXF (rooms as filled polygons).
- Bring into QGIS (free)
- Add the DXF as a vector layer.
- If needed, run Polygonize to convert lines to polygons.
- Add an attribute name (matching Room IDs).
- Export GeoJSON
- Right-click layer → Export → GeoJSON.
- Convert to TopoJSON
- 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.
- Power BI Shape Map
- Visual → Shape map → Custom map → import rooms.json.
- Bind your data’s Location column to the name property.
I hope it wil help