Photodome become like a ball in mobile

Hi when i open my url in mobile the photo dome become like a small ball when i zoom out. i want my camera should always be in same position no matter what.

There are other materitals like BABYLON.GUI.CylinderPanel even they become small apart from above. since they become so small on swipe there is no use of taking picture for them too.

Kindly help me here .

Hey @Amit_Sharma,

Is there any way you could set up a playground that shows off the issue you have? It’s always much easier to troubleshoot when we can look at some code with you!

If I’m understanding you correctly, it sounds like you’re able to zoom the camera outside of the photosphere and you’d like to limit that effect so that the camera always stays within the sphere? Am I understanding the problem correctly?

If so, it would also be helpful to know what type of camera you are using. There are limit properties that you can set on cameras to have control over this very thing.

Using the Arc Rotate Camera as an example, by limiting the “upperRadiusLimit” property, you can specify how far out the camera should be able to zoom out.

Here are a couple of handy docs to check out:
https://doc.babylonjs.com/babylon101/cameras#arc-rotate-camera

https://doc.babylonjs.com/api/classes/babylon.arcrotatecamera

Hope that helps answer your question.

i donot want my camera to zoom out at all .
i will try to make playground but for now sending some code.

var createScene = function (engine) {
BABYLON.Database.IDBStorageEnabled = true;
var scene = new BABYLON.Scene(engine);
var camera = new BABYLON.ArcRotateCamera(“Camera”, -Math.PI / 2, Math.PI / 2, 5, new BABYLON.Vector3(0, 0, 0), scene, true);
camera.attachControl(canvas, true);
camera.inputs.attached.mousewheel.detachControl(canvas);
var tickCount = -240, zoomLevel = 1;
dome = new BABYLON.PhotoDome(
“testdome”,
“<?php echo get_stylesheet_directory_uri(); ?>/template/textures/360bg_index.jpg”,
{
resolution: 32,
size: 1000
},
scene
);

Gotcha. I see that you’re disabling the mouswheel control in an effort to stop zooming. This will work for a mouse, but not for touch.

A different approach is to use upper and lower radius limits of the camera.

Check out this playground. I think this should do what you’re looking for.

Let me know if this doesn’t solve it.

https://playground.babylonjs.com/#HI28QP#1

https://playground.babylonjs.com/#SFAYC4

ok i will try in just a movement

really thanks i did some thing like this now it is working

camera.upperRadiusLimit = camera.radius;
camera.lowerRadiusLimit = camera.radius;

1 Like

Awesome! Glad it’s working!