The ultimate Fabric, Power BI, SQL, and AI community-led learning event. Save €200 with code FABCOMM.
Get registeredCompete to become Power BI Data Viz World Champion! First round ends August 18th. Get started.
Hi everyone,
I need to create a table includes:
How can I achieve this in Power BI? Should I use a matrix, custom visuals, or another approach? Also, how can I display progress bars within the table?
The output should look like this:
Thanks in advance!
Solved! Go to Solution.
Hi @Anonymous
You can use a table visual. For the progress bar, you can generate an SVG image using DAX.
ProgressBar =
VAR Percentage = SELECTEDVALUE(Progressbar[ Progress ]) * 100 // Dynamic percentage
VAR BarColor = "#3498db" // Bar color
VAR BorderColor = "black" // Border color
VAR BorderWidth = 1 // Border width
VAR Width = 150 // Total width
VAR Height = 25// Bar height (Adjusted to align)
VAR CellHeight = 40 // Adjust for vertical centering
VAR BarWidth = DIVIDE(Percentage * (Width - (2 * BorderWidth)), 100) // Ensure it fits inside the border
VAR SVG =
"data:image/svg+xml;utf8," &
"<svg width='" & FORMAT(Width, "0") & "' height='" & FORMAT(CellHeight, "0") &
"' viewBox='-1 -1 " & FORMAT(Width + 2, "0") & " " & FORMAT(CellHeight + 2, "0") &
"' xmlns='http://www.w3.org/2000/svg'>" &
// Centering using transform attribute
"<g transform='translate(0, " & FORMAT((CellHeight - Height) / 2, "0") & ")'>" &
// Border rectangle
"<rect x='" & FORMAT(BorderWidth / 2, "0") & "' y='" & FORMAT(BorderWidth / 2, "0") & "' width='" & FORMAT(Width - BorderWidth, "0") & "' height='" & FORMAT(Height, "0") &
"' fill='white' stroke='" & BorderColor & "' stroke-width='" & FORMAT(BorderWidth, "0") & "' />" &
// Filled progress bar
"<rect x='" & FORMAT(BorderWidth, "0") & "' y='" & FORMAT(BorderWidth / 2, "0") & "' width='" & FORMAT(BarWidth, "0") & "' height='" & FORMAT(Height - BorderWidth + 0.8, "0") &
"' fill='" & BarColor & "' />" &
"</g>" & // Close group
"</svg>"
RETURN SVG
Make sure to categorize it as an image url. You can use AI to generate a DAX SVG image like I did.
Please see the attached sample pbix.
Hi @Anonymous
You can use a table visual. For the progress bar, you can generate an SVG image using DAX.
ProgressBar =
VAR Percentage = SELECTEDVALUE(Progressbar[ Progress ]) * 100 // Dynamic percentage
VAR BarColor = "#3498db" // Bar color
VAR BorderColor = "black" // Border color
VAR BorderWidth = 1 // Border width
VAR Width = 150 // Total width
VAR Height = 25// Bar height (Adjusted to align)
VAR CellHeight = 40 // Adjust for vertical centering
VAR BarWidth = DIVIDE(Percentage * (Width - (2 * BorderWidth)), 100) // Ensure it fits inside the border
VAR SVG =
"data:image/svg+xml;utf8," &
"<svg width='" & FORMAT(Width, "0") & "' height='" & FORMAT(CellHeight, "0") &
"' viewBox='-1 -1 " & FORMAT(Width + 2, "0") & " " & FORMAT(CellHeight + 2, "0") &
"' xmlns='http://www.w3.org/2000/svg'>" &
// Centering using transform attribute
"<g transform='translate(0, " & FORMAT((CellHeight - Height) / 2, "0") & ")'>" &
// Border rectangle
"<rect x='" & FORMAT(BorderWidth / 2, "0") & "' y='" & FORMAT(BorderWidth / 2, "0") & "' width='" & FORMAT(Width - BorderWidth, "0") & "' height='" & FORMAT(Height, "0") &
"' fill='white' stroke='" & BorderColor & "' stroke-width='" & FORMAT(BorderWidth, "0") & "' />" &
// Filled progress bar
"<rect x='" & FORMAT(BorderWidth, "0") & "' y='" & FORMAT(BorderWidth / 2, "0") & "' width='" & FORMAT(BarWidth, "0") & "' height='" & FORMAT(Height - BorderWidth + 0.8, "0") &
"' fill='" & BarColor & "' />" &
"</g>" & // Close group
"</svg>"
RETURN SVG
Make sure to categorize it as an image url. You can use AI to generate a DAX SVG image like I did.
Please see the attached sample pbix.
Hi @Anonymous,
As per the requirement you need to choose which view you want to opt for:
Table Visual – Best for structured reporting
Matrix Visual – Best if you need hierarchical grouping
You can use a multi-row card to display Goal Description, Number of Tasks, and Responsible Person above the table visual.
Power BI does not natively support progress bars in tables, but you can simulate them using conditional formatting:
To Create a Progress bar in Power BI, follow below steps:-
🌟 I hope this solution helps you unlock your Power BI potential! If you found it helpful, click 'Mark as Solution' to guide others toward the answers they need.
💡 Love the effort? Drop the kudos! Your appreciation fuels community spirit and innovation.
🎖 As a proud SuperUser and Microsoft Partner, we’re here to empower your data journey and the Power BI Community at large.
🔗 Curious to explore more? [Discover here].
Let’s keep building smarter solutions together!