{"id":39,"date":"2023-03-28T11:17:23","date_gmt":"2023-03-28T11:17:23","guid":{"rendered":"https:\/\/blog.ivos.place\/?p=39"},"modified":"2023-04-05T16:40:59","modified_gmt":"2023-04-05T16:40:59","slug":"custom-map-visuals","status":"publish","type":"post","link":"https:\/\/blog.ivos.place\/?p=39","title":{"rendered":"(Mis-)use custom map visuals in Power BI"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Use case<\/h2>\n\n\n\n<p>In this blog post, I will show you how to use custom map visuals in Power BI to display something different than a region on a world map. <\/p>\n\n\n\n<p>I first stumbled upon custom map visuals years ago using Reporting Services Mobile Reports. Back then, my boss used to visualize figures on different regions of Switzerland based own region definitions given by the business. <\/p>\n\n\n\n<p>Based on personal interest, I created a dataset using open data to get the votes of members in the Swiss National Council. I want to display the members on their effective place in the seat plan of the parliament. As I looked at the image of the parliament, I suddenly thought about it as a map. It actually displays a certain object placed on a respective geographical location &#8211; even if there is no need for longitude and latitude (in terms of placement on our world map)<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/blog.ivos.place\/wp-content\/uploads\/2023\/03\/image.png\" alt=\"\" class=\"wp-image-45\" width=\"826\" height=\"613\"\/><figcaption class=\"wp-element-caption\">Swiss Parliament (Source: https:\/\/www.parlament.ch)<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Approach<\/h2>\n\n\n\n<p>I often try to avoid 3rd party visuals and I check first, if the requirement could be fulfilled with a built-in visual. So I gave the custom map visuals a go!<\/p>\n\n\n\n<div class=\"wp-block-columns has-small-font-size is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:50%\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"301\" src=\"https:\/\/blog.ivos.place\/wp-content\/uploads\/2023\/03\/image-3.png\" alt=\"\" class=\"wp-image-50\" srcset=\"https:\/\/blog.ivos.place\/wp-content\/uploads\/2023\/03\/image-3.png 600w, https:\/\/blog.ivos.place\/wp-content\/uploads\/2023\/03\/image-3-300x151.png 300w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"237\" height=\"228\" src=\"https:\/\/blog.ivos.place\/wp-content\/uploads\/2023\/03\/image-4.png\" alt=\"\" class=\"wp-image-52\"\/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column has-medium-font-size is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:50%\">\n<p>First, you need to activate the shape map visuals in the preview features settings in Power BI desktop. It will show up in your visual selection pane afterwards.<\/p>\n\n\n\n<p>Custom map visuals need a GeoJSON file to display the custom maps. I&#8217;d have to generate one using the parliament seating plan.<\/p>\n<\/div>\n<\/div>\n\n\n\n<p>The seat plan above needs do be represented as GeoJSON file defining the single seats as objects. They also need to have a ID to be able to identify and use them in the report. In this specific example i needed 3rd party tools to convert the seat plan first to a SVG, then to a JSON file (I have used the following converter: <a href=\"https:\/\/mygeodata.cloud\/converter\/\">Online GIS\/CAD Data Converter | SHP, KML, KMZ, TAB, CSV, &#8230; (mygeodata.cloud)<\/a>).<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"332\" height=\"267\" src=\"https:\/\/blog.ivos.place\/wp-content\/uploads\/2023\/03\/image-6.png\" alt=\"\" class=\"wp-image-66\" srcset=\"https:\/\/blog.ivos.place\/wp-content\/uploads\/2023\/03\/image-6.png 332w, https:\/\/blog.ivos.place\/wp-content\/uploads\/2023\/03\/image-6-300x241.png 300w\" sizes=\"auto, (max-width: 332px) 100vw, 332px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<p>In the JSON file resulting, an id has to be added to every polygon defined in the JSON file. Those Ids are connected to the respective data in Power BI afterwards. Adjustments like this or other transformations can be done with the online tool mapshaper (<a href=\"https:\/\/mapshaper.org\/\">mapshaper<\/a>). <\/p>\n<\/div>\n<\/div>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>Hint<\/p>\n<cite>On one point, I had to rotate the whole JSON file by 180 degrees. I was able to achieve this by using the following command in mapshaper: &#8220;mapshaper -affine rotate=180&#8221;. Just if you are struggling with this \ud83d\ude09<\/cite><\/blockquote>\n\n\n\n<p>The Id in your data is now connected to the polygons by using the Id in the &#8220;Location&#8221; attribute of the custom map visual.<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"202\" height=\"132\" src=\"https:\/\/blog.ivos.place\/wp-content\/uploads\/2023\/03\/image-7.png\" alt=\"\" class=\"wp-image-67\"\/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"496\" height=\"295\" src=\"https:\/\/blog.ivos.place\/wp-content\/uploads\/2023\/03\/image-8.png\" alt=\"\" class=\"wp-image-68\" srcset=\"https:\/\/blog.ivos.place\/wp-content\/uploads\/2023\/03\/image-8.png 496w, https:\/\/blog.ivos.place\/wp-content\/uploads\/2023\/03\/image-8-300x178.png 300w\" sizes=\"auto, (max-width: 496px) 100vw, 496px\" \/><\/figure>\n<\/div>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n\n\n<p>This was a first trial on (mis-) using custom map visuals not showing &#8220;real&#8221; geographic data on the world map but allocating areas on a complete different map, like a seating plan. <\/p>\n\n\n\n<p>Do you have used custom map visuals for other purposes than real world maps as well? Let me know in the comments!<\/p>\n\n\n\n<p>This is my final report in action, showing vote results based on my seating map:<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"blog.ivos.place | Demo 1 | (Mis-)use custom map visuals in Power BI\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/hTPX4QyRgL4?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>Use case In this blog post, I will show you how to use custom map visuals in Power BI to display something different than a region on a world map. I first stumbled upon custom map visuals years ago using Reporting Services Mobile Reports. Back then, my boss used to visualize figures on different regions [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9],"tags":[],"class_list":["post-39","post","type-post","status-publish","format-standard","hentry","category-powerbi"],"_links":{"self":[{"href":"https:\/\/blog.ivos.place\/index.php?rest_route=\/wp\/v2\/posts\/39","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.ivos.place\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.ivos.place\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.ivos.place\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.ivos.place\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=39"}],"version-history":[{"count":10,"href":"https:\/\/blog.ivos.place\/index.php?rest_route=\/wp\/v2\/posts\/39\/revisions"}],"predecessor-version":[{"id":75,"href":"https:\/\/blog.ivos.place\/index.php?rest_route=\/wp\/v2\/posts\/39\/revisions\/75"}],"wp:attachment":[{"href":"https:\/\/blog.ivos.place\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=39"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.ivos.place\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=39"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.ivos.place\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=39"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}