Skip to content

fix(cms-base-layer): fit small 3D models to viewport in SwMedia3D#2346

Open
Johannes Berthel (joberthel) wants to merge 1 commit intoshopware:mainfrom
joberthel:fix/use-boundary-box-for-3d-model
Open

fix(cms-base-layer): fit small 3D models to viewport in SwMedia3D#2346
Johannes Berthel (joberthel) wants to merge 1 commit intoshopware:mainfrom
joberthel:fix/use-boundary-box-for-3d-model

Conversation

@joberthel

Description

This PR fixes an issue in SwMedia3D where very small 3D models could appear tiny in the scene and be hard to inspect.

The component now auto-fits the loaded 3D model into the viewport by using bounds-based framing, which improves visibility and usability.

Type of change

Bug fix (non-breaking change that fixes an issue)

ToDo's

  • Changeset file provided

Additional context

Issue can be reproduced with this GLB-File.

@vercel
Copy link

vercel bot commented Mar 19, 2026

Johannes Berthel (@joberthel) is attempting to deploy a commit to the Shopware Frontends Team on Vercel.

A member of the Team first needs to authorize it.

Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

This PR updates SwMedia3D in @shopware/cms-base-layer to better frame very small GLB/GLTF models by introducing bounds-based viewport fitting, improving model visibility and inspection usability in CMS contexts.

Changes:

  • Wrap the loaded 3D model in @tresjs/cientos Bounds to auto-frame the model in the viewport.
  • Set OrbitControls as default controls to work with the bounds/framing behavior.
  • Add a changeset documenting the patch-level improvement.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.

File Description
packages/cms-base-layer/app/components/SwMedia3D.vue Adds bounds-based framing (Bounds) around the rendered model and adjusts controls to improve viewport fit for small models.
.changeset/slimy-toys-vanish.md Records a patch changeset describing the improved SwMedia3D model framing behavior.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

<primitive v-if="model" :object="model" />
<OrbitControls make-default />
<Bounds ref="boundsRef" clip use-mounted>
<primitive v-if="model" :object="model" @click="() => focusObject()" />
Copy link

Copilot AI Mar 20, 2026

Choose a reason for hiding this comment

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

The inline arrow function in the template (@click="() => focusObject()") creates a new function on every render. Bind the handler directly (e.g. @click="focusObject") to avoid unnecessary allocations and keep the template simpler.

Suggested change
<primitive v-if="model" :object="model" @click="() => focusObject()" />
<primitive v-if="model" :object="model" @click="focusObject" />

Copilot uses AI. Check for mistakes.
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.

2 participants