Skip to content

CSS2DRenderer: Support Rotation - #33474

Merged
Mugen87 merged 2 commits into
mrdoob:devfrom
WestLangley:dev-css2Drenderer_rotation
Jul 17, 2026
Merged

CSS2DRenderer: Support Rotation#33474
Mugen87 merged 2 commits into
mrdoob:devfrom
WestLangley:dev-css2Drenderer_rotation

Conversation

@WestLangley

@WestLangley WestLangley commented Apr 26, 2026

Copy link
Copy Markdown
Collaborator

Fixes: #33455

In this PR, the existing .center property serves a dual purpose. It is both the center of rotation and the anchor point. I am not sure there is a need to decouple them.

I think "anchor" or "pivot" would be better nomenclature -- for a future PR, perhaps.

@WestLangley WestLangley added this to the r185 milestone Apr 26, 2026
* `( 0, 0 )` is the lower left, `( 1, 1 )` is the top right.
* The object's anchor point, and the point around which the object rotates.
* A value of `(0.5, 0.5)` corresponds to the midpoint of the object. A value
* of `(0, 0)` corresponds to the upper left corner of the object.

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I did not change the implementation of the "center" API. (0, 0) was always the upper-left, not the lower-left, in this renderer.

The upper-left/lower-left convention is not consistent in three.js, and perhaps it would be advisable to agree to a convention going forward.

Comment thread examples/jsm/renderers/CSS2DRenderer.js Outdated
@WestLangley

Copy link
Copy Markdown
Collaborator Author

/ping @johnperry-math @yomotsu

@WestLangley
WestLangley marked this pull request as ready for review April 30, 2026 01:04
@johnperry-math

Copy link
Copy Markdown

I like the change. My only suggestion would be to add some words to the description of the CSS2DObject to the effect of

  • transformations can only be performed using CSS rotate property and the .center and rotationAngle properties.
  • the effect of these transformations is equivalent to the CSS transform rotate(<value_of_css_rotate>) translate(..,..) translate(..,..) rotate(<value_of_rotationAngle>) (correcting what i've written as need be

@mrdoob mrdoob modified the milestones: r185, r186 Jun 24, 2026
@WestLangley

Copy link
Copy Markdown
Collaborator Author

@Mugen87 This is a low-impact enhancement. My intention is to revert the changes to the example, and merge this.

@Mugen87

Mugen87 commented Jul 17, 2026

Copy link
Copy Markdown
Collaborator

Sounds good!

@WestLangley
WestLangley force-pushed the dev-css2Drenderer_rotation branch from 9329a44 to a7de1be Compare July 17, 2026 14:29
Comment thread docs/pages/CSS2DRenderer.html Outdated
@WestLangley
WestLangley force-pushed the dev-css2Drenderer_rotation branch from 5c8b656 to 772f2aa Compare July 17, 2026 15:16
@github-actions

Copy link
Copy Markdown

🖼️ E2E screenshot tests

1 example(s) failed (full artifacts).

Example Expected Actual Diff
webgpu_pmrem_cubemap

@Mugen87
Mugen87 merged commit 9813ee7 into mrdoob:dev Jul 17, 2026
7 of 9 checks passed
@WestLangley
WestLangley deleted the dev-css2Drenderer_rotation branch July 17, 2026 16:12
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Ability to rotate a CSS2DObject

4 participants