2023 Week 32 | Power BI: SVG Pictogram

Power BI, Workout Wednesday / By

Introduction

This week’s challenge was inspired by FiveThirtyEight’s Nobody had more style than Jay Wright created by Ryan Best

For this week’s challenge we will be creating SVGs with shape elements that are coloured dynamically based on field values.

Create your own SVG and add your own flair to this design.

Requirements

Obtain the source data via link below

  • In Power Query, add Index column
  • Create a Custom Index column named “Column” that repeats that repeats every 10th row. (Hint use modulo)
  • Create a Custom Index column named “Row” = Table.AddIndexColumn(#”Renamed Columns”, “Row”, 1, 1/10, Int64.Type)
  • Round the values in “Row” down
  • Close and apply

Graph 1

  • Create your own Suit SVG or use mine
  • Obtain the SVG Path (view code in GitHub)
  • Copy code and replace all ” with ‘
  • Create a new measure called “Suit SVG”
  • Paste the SVG code, ensuring it is encapsulated with ” “
  • Add the data image prefix “data:image/svg+xml;utf8,”
  • For each of the SVG elements, replace the fill colour with clothing item colour.
  • E.g. for the suit shape element, replace the fill colour with the suit colour values from the suit column:
  • <path id=’suit’ d=… fill=’ ” & [SUITColour] & ” ‘ fill-rule=’evenodd’/>
  • Change the measure Data Category to ‘Image URL’
  • Place a Matrix Visual on the page
  • Place “Column” field in the Columns field well
  • Place “Row” field in the Rows field well
  • Add “Suit SVG” measure to the Values field well
  • Format as desired
Extra
  •  Adjust the colours for each of the clothing items for better visual appeal
  • Try this using the HTML Content Visual

Dataset

This week’s data can be found at Github : https://github.com/kolky001/Workout-Wednesday-2023/blob/main/JayWright.xlsx 

Share

After you finish your workout, share on Twitter using the hashtags #WOW2023 and #PowerBI, and tag @MMarie, @shan_gsd, @KerryKolosko. Also make sure to fill out the Submission Tracker so that we can count you as a participant this week in order to track our participation throughout the year.

Solution

Solution File available for download via Data Stories Gallery.

Scroll to Top