Forum Discussion

Harika05's avatar
Harika05
Helper I
5 months ago
Solved

Embedding bullet chart in a table

Hello, Wanted to know if we can have a bullet chart inside a table similar to this in power bi  
  • Natarajan_M's avatar
    5 months ago

    Hi Harika05  , We do not have an inbuilt feature for bullet charts; we will need to use the SVG approach.

    Sample Data:

     

    Op:



    DAX:

    Bullet Chart SVG = 
    VAR Actual  = SUM('SalesDataSVG'[ActualSales])
    VAR Target  = SUM('SalesDataSVG'[SalesTarget])
    VAR W       = 200
    VAR H       = 40
    
    -- Target is ALWAYS full width — actual fills % of that
    VAR Pct     = DIVIDE(Actual, Target, 0)
    VAR ActW    = ROUND(MIN(Pct, 1) * W, 0)
    
    -- Overshoot when actual > target
    VAR OverW   = IF(Actual > Target, ROUND((Pct - 1) * W, 0), 0)
    
    -- Heights — target wide, actual narrow
    VAR TgtH    = 22
    VAR ActH    = 9
    VAR TgtY    = (H - TgtH) / 2
    VAR ActY    = (H - ActH) / 2
    
    VAR ActColor =
        IF(Actual >= Target,        "#1D6A3A",
        IF(Actual >= Target * 0.85, "#1A4F7A",
                                    "#922B21"))
    
    RETURN
    "data:image/svg+xml;utf8," &
    "<svg xmlns='http://www.w3.org/2000/svg'" &
    " viewBox='0 0 " & (W + 20) & " " & H & "'" &
    " preserveAspectRatio='xMinYMid meet'" &
    " width='" & (W + 20) & "' height='" & H & "'>" &
    
    -- 1. Grey track — always full W
    "<rect x='0' y='" & TgtY & "' width='" & W & "' height='" & TgtH & "'" &
    " fill='#D5D8DC' rx='4'/>" &
    
    -- 2. Light blue target bar — always full W
    "<rect x='0' y='" & TgtY & "' width='" & W & "' height='" & TgtH & "'" &
    " fill='#AED6F1' rx='4'/>" &
    
    -- 3. Narrow actual bar — fills only its % of target width
    "<rect x='0' y='" & ActY & "' width='" & ActW & "' height='" & ActH & "'" &
    " fill='" & ActColor & "' rx='3'/>" &
    
    -- 4. Overshoot bar — extends beyond W when actual > target
    IF(Actual > Target,
        "<rect x='" & W & "' y='" & ActY & "' width='" & OverW & "' height='" & ActH & "'" &
        " fill='#1D6A3A' rx='2'/>",
        "") &
    
    -- 5. Right edge target boundary marker
    "<rect x='" & (W - 3) & "' y='" & (TgtY - 4) & "' width='3' height='" & (TgtH + 8) & "'" &
    " fill='#2C3E50' rx='1'/>" &
    
    "</svg>"


    Sample PBIX:
    Rag status.pbix

    If you found this helpful, please consider giving it a kudo and marking it as the accepted solution — it goes a long way in helping others facing the same issue.

    For more Power BI tips and discussions, let’s connect on LinkedIn:
    https://www.linkedin.com/in/natarajan-manivasagan

    Cheers!