Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

Join us for an expert-led overview of the tools and concepts you'll need to become a Certified Power BI Data Analyst and pass exam PL-300. Register now.

Reply
amaddala
Helper I
Helper I

Modify SVG size for inline Sparklines in a Matrix visual

I am trying to create inline sparkline charts using embedded SVGs for a matrix in Power BI. Below is the code for formatting the image. However, the image is occupying the top left side of the cell instead of occupying the entire cell. I need to fix the image to occupy the entire cell instead.

 

VAR SVGImageURL = "data:image/svg+xml;utf8," &

"<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 100 100'>" &

"<polyline fill='none' stroke='" & LineColor & "' stroke-width='1' points='"& Lines &

"'/></svg>"

 

 I tried to change the "image height" in the "format" section in Visualizations pane but that doesnt change the width. I also tried to add width parameter to the Html but it doesnt seem to reflect in the image. Below is the image of my visual.

 

 

Visual.png

 

1 ACCEPTED SOLUTION
Anonymous
Not applicable

@amaddala 

Try add both width and height in the code, the range supported in power bi is 24px to 150px, so try 100 x 100 px. 

 

VAR SVGImageURL = "data&colon;image/svg+xml;utf8," &

"<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 100 100'>" &

"<polyline fill='none' stroke='" & LineColor & "' stroke-width='1' points='"& Lines &

"'/></svg>"

 

Paul Zheng _ Community Support Team
If this post helps, please Accept it as the solution to help the other members find it more quickly.

View solution in original post

2 REPLIES 2
Anonymous
Not applicable

@amaddala 

Try add both width and height in the code, the range supported in power bi is 24px to 150px, so try 100 x 100 px. 

 

VAR SVGImageURL = "data&colon;image/svg+xml;utf8," &

"<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 100 100'>" &

"<polyline fill='none' stroke='" & LineColor & "' stroke-width='1' points='"& Lines &

"'/></svg>"

 

Paul Zheng _ Community Support Team
If this post helps, please Accept it as the solution to help the other members find it more quickly.

amitchandak
Super User
Super User

@amaddala , have tried changing the viewbox parameters

Share with Power BI Enthusiasts: Full Power BI Video (20 Hours) YouTube
Microsoft Fabric Series 60+ Videos YouTube
Microsoft Fabric Hindi End to End YouTube

Helpful resources

Announcements
Join our Fabric User Panel

Join our Fabric User Panel

This is your chance to engage directly with the engineering team behind Fabric and Power BI. Share your experiences and shape the future.

June 2025 Power BI Update Carousel

Power BI Monthly Update - June 2025

Check out the June 2025 Power BI update to learn about new features.

June 2025 community update carousel

Fabric Community Update - June 2025

Find out what's new and trending in the Fabric community.