matchedGeometryEffect works incorrectly

I am practising matchedGeometryEffect.

 struct ContentView: View {
    @Namespace var tem
    @State var isTemp: Bool = true
        
    var body: some View{
        ZStack{
            if isTemp{
                Circle()
                    .matchedGeometryEffect(id: "haha", in: tem, anchor: .center)
                    .foregroundColor(.green)
                    .frame(width: 200, height: 200)
            }else{
                Rectangle()
                    .matchedGeometryEffect(id: "haha", in: tem, anchor: .center)
                    .foregroundColor(.blue).opacity(0.4)
                    .frame(width: 400, height: 600)
            }
            
            Button {
                withAnimation(.linear(duration: 5)){
                    isTemp = false
                }
            } label: {
                Text("switch")
            }
        }
    }
}

If I set anchor to top, it works well with the tops of both shapes remaining alignment.

When I set anchor to center, I expect both shapes should stay at the center point of screen and extend around. However, only the rectangle stays still as expected, while the circle descends like bottom anchor effect.

What's more, if I set anchor to bottom, the circle descends more quickly. Is it a normal behavior? Do I miss anything?