И то, и другое - горизонтальное расстояние экрана от окна, или я тут совсем не прав?
Я не совсем уверен, что вы имели в виду под $canvas
, но, как сказано здесь (MDN) о Element.getBoundingClientRect()
:
The Element.getBoundingClientRect() method returns a DOMRect object providing information about the size of an element and its position relative to the viewport.
А по поводу viewport
здесь (MDN):
A viewport represents a polygonal (normally rectangular) area in computer graphics that is currently being viewed. In web browser terms, it refers to the part of the document you're viewing which is currently visible in its window (or the screen, if the document is being viewed in full screen mode). Content outside the viewport is not visible onscreen until scrolled into view.
И здесь (MDN) о Window.screenX()
The Window.screenX read-only property returns the horizontal distance, in CSS pixels, of the left border of the user's browser viewport to the left side of the screen.
Так что ответ на ваш вопрос - нет. Они разные. Первый относится к окну браузера, а второй — к экрану. Если браузер работает в полноэкранном режиме, они могут совпадать.