Понимание масштаба холста HTML 5 и порядка перевода

Я рисую график вокруг центра X, Y 0,0. Когда пришло время рендеринга, я меняю положение с помощью translate, а затем использую масштаб, чтобы график заполнил холст (, т.е. масштабирую все, например, на 50% ).

Я заметил, что имеет значение, вызываете ли вы масштаб, а затем переводите, или переводите, а затем масштабируете, и я не могу понять это. Это проблема, так как все не всегда подходит, но моя ментальная модель не завершена, поэтому мне трудно ее исправить.

Может кто-нибудь объяснить, почему порядок шкалы и перевода вызовов имеет значение?