Inconsistent scaling for “Image Target + SLAM Manipulate 3D Model”

🧑‍💻 Technical Support
1

Hello, I find AR models are NEVER CONSISTENTLY SCALED when I use the “Image Target + SLAM Manipulate 3D Model” template.

We have a major art gallery exhibition IN FIVE DAYS, and we want our AR experience to work exceptionally well. We’ve been using this template in art gallery venues for the past two years, but the experience is never as good as we’d like.

Can someone please help me identify the problem and potential fix? Or is there a document, tutorial, or forum topic that addresses this issue? Or should I be trying a different approach? (I’m experienced in numerous programming languages and graphical systems, but just a JS and A-Frame novice. I get by with modifying 8th wall templates incrementally.)

This is the EXPERIENCE we want:
(1) Visitors are instructed to scan the QR code next to each painting.

(2) When the app launches, visitors point their camera at the painting.

(3) When the app finds the image, it displays the 3D model used in the creation of the painting. Note: We try to position and scale the model to be in front of the painting and the right size relative to the painting (or relative to a picture of the painting in a book).

(4) The user is then encouraged to move around and turn around inside the 3D model. Note: we decided to use SLAM for persisting the model size and position regardless of whether the painting is in view. Unfortunately, the model is not scaled consistently from run-to-run, and even changes scale abruptly within a run. The scale seems to be loosely related to the camera’s distance when the image is found, so for each installation we determine the optimal initial distance (e.g. 6 feet).

(5) We instruct users to begin by standing the optimal distance. Even so, the model changes size (and position) too much from run to run.

Please refer to the template Image Target + SLAM Manipulate 3D Model | 8th Wall Playground | 8th Wall.

(I will include the results of 10 test runs in a follow-up message, documenting how scaling varies from run to run.)

I would appreciate all suggestions.

1 Like
2

I ran the template Image Target + SLAM Manipulate 3D Model | 8th Wall Playground | 8th Wall) 10 times with default configuration.

  • 3 runs with image-found at around 10 inches from the target on my screen
    • Scaling was relatively SMALL for 2 runs, and MEDIUM for 1 run
  • 3 runs with image-found at around 20 inches from the target on my screen
    • Scaling was relatively MEDIUM for 2 runs, and LARGE for 1 run
  • 3 runs with image-found at around 40 inches from the target on my screen
    • Scaling was relatively LARGE for 2 runs, and SMALL for 1 run
  • 1 run with image-found at around 60 inches from the target on my screen
    • Scaling was relatively MEDIUM

Screenshot 2024-05-25 at 10.43.14 PM
Screenshot 2024-05-25 at 10.43.14 PM1514×916 184 KB

Findings:

  • Close distances usually yield SMALL models
  • Medium distances usually yield MEDIUM models
  • Far distances usually yield LARGE models
  • But there are some exceptions.
3

If I find anything inconsistent, I change my approach.

Set a fixed scale based on the model
When looking at the model spawn component, the scale seems to be set to 1, which makes me believe that the z-coordinate is wrong. Have you tried playing around by setting these values to fixed values?

model.object3D.position.set(detail.position.x, 0, detail.position.z)
model.object3D.lookAt(cam.object3D.position.x, model.object3D.position.y, cam.object3D.position.z)

Also, it feels wrong to me to first scan a QR code only to scan another target. Let the QR code activate the 3D model. You know where the QR code is relative to the painting.

Have the model appear static on the screen
Limit the user’s options to merely rotating and zooming the model. To do that, place the model inside a-camera. You don’t need SLAM for this to work.

I can tell you that it took me three weeks to get the correct scaling of targets, but that also included getting dynamic image targets through pooling to work.

5

Thank you @Rickard_Elimaa !

Set a fixed scale based on the model

  • Great suggestion. This clarifies a lot for me. I will try.

Let the QR code activate the 3D model.

  • Another fine suggestion.
  • One minor issue is we need to recalibrate for each new installation.
  • And a different code in a book.

Have the model appear static on the screen

  • Thanks. But we’d prefer to stay with the Walk-Through experience in the gallery.
  • Maybe switch to a touch UI for a book?
  • (NOTE: minor edits since previous posting.)
6

Hi @Rickard_Elimaa and all,
I tried setting detail.position.z to a constant (zero), but I am still getting inconsistent results. The object scaling does not remain constant between runs, and the object scaling or position sometimes jumps around within a run.

Perhaps SLAM is too erratic to count on for this application? Or maybe I’m doing something wrong?

Could you please look at this updated code in addEventListener and see if anything looks wrong,

        model.addEventListener('model-loaded', () => {
          model.setAttribute('visible', 'true')
          //  *** Remove TOUCH UI
          // model.object3D.position.set(detail.position.x, 0, detail.position.z)
          // The root node of your 3D model will appear near the MIDDLE of the image target and at z=0
          model.object3D.position.set(detail.position.x, detail.position.y - 0.1, 0)
          model.object3D.rotation.set(0, 0, 45)
          model.object3D.scale.set(0.10, 0.10, 0.10)
          // model.object3D.lookAt(cam.object3D.position.x, model.object3D.position.y, cam.object3D.position.z)
        })

Changes include

  1. Remove Touch UI (no need for user to scale or rotate the model)
  2. Set the Y position to near middle of the target image
  3. Set the Z position to zero (does this make sense?? Is there a better constant value?)
  4. Test various rotation and scale values,
  5. Eliminate model.object3D.lookAt (this ensures that rotation is not ignored. Does this make sense?)

I printed the following values to the console (highlighted values seem to increase with distance.) Do you think these values can be used differently to correct the model?

CLOSE UP
detail.position = 006, 1.152, **-0.318**
detail.rotation = 0.182, 0.002, 0.004
detail.scale = **0.743**
cam.object3D.position = 0.003, 1.498, -0.012
cam.object3D.rotation = -0.491, -0.001, -0.023
cam.object3D.scale = 1, 1, 1

FAR DISTANCE
detail.position = 0.250, 0.478, **-3.836**
detail.rotation = 0.192, -0.058, -0.017
detail.scale = **1.113**
cam.object3D.position = 0.611, 1.582, -0.370
cam.object3D.rotation = -0.415, 0.94, -0.026
cam.object3D.scale = 1, 1, 1

Any further insights will be appreciated.