How can I animate Swift Charts bar marks to expand from the left edge?

You need to change the “anchor” used when scaling the bars. When you directly animate the xEnd value, Swift Charts still calculates the bar’s center as (xStart + xEnd)/2 so that the bar appears to expand equally to the left and right. One solution is to “fake” the animation by keeping a fixed (zero) xStart while animating a scaling transform that’s anchored on the leading edge. For example, instead of using a mutable xEnd value, you can draw a full‐length bar and then clip (or scale) its width with a scaleEffect whose x‑axis is anchored at .leading. For instance:

–––––––––––––––––––––––––––––––––––––––––––––––––––

SWIFTCopied
private struct ChartView: View {
    let sections: [BoughtItemsByTagSection]
    @State private var progress: CGFloat = 0

    var body: some View {
        Chart(sections) { section in
            // Draw the bar mark as if it were full length.
            BarMark(
                xStart: .value("Start", 0),
                xEnd: .value("Price", section.header.totalPrice),
                y: .value("Category", section.header.name)
            )
            .foregroundStyle(Theme.accentSec)
            // Wrap the mark in a container that applies a scaleEffect
            // anchored to the leading edge.
            .scaleEffect(x: progress, y: 1, anchor: .leading)
        }
        .chartLegend(.hidden)
        .chartXAxis(.hidden)
        .chartYAxis {
            AxisMarks { _ in
                AxisValueLabel()
                    .foregroundStyle(Color.black)
            }
        }
        .aspectRatio(1, contentMode: .fit)
        .onAppear {
            animateChart()
        }
    }

    private func animateChart() {
        progress = 0 // Start from zero
        withAnimation(.easeOut(duration: 1.5)) {
            progress = 1
        }
    }
}

–––––––––––––––––––––––––––––––––––––––––––––––––––

In this approach the BarMark is drawn at full possible width but is immediately scaled horizontally by the factor “progress” (ranging from 0 to 1) with its left (leading) edge as an anchor. You then animate progress from 0 to 1, and the bars grow only from the left edge.

An alternative approach would be to remove any extra modifiers (like the position(by:) in your original attempt) that cause the bar’s center to be used for animation, but the scaleEffect technique is usually the simplest way to “anchor” the animation where you want it.