# \[SOLVED\] camera.attachControl not working

**URL:** <https://forum.babylonjs.com/t/solved-camera-attachcontrol-not-working/40318>\
**Category:** Questions\
**Created:** [April 28, 2023, 1:47am UTC](https://forum.babylonjs.com/t/solved-camera-attachcontrol-not-working/40318 "2023-04-28T01:47:47Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Baylock](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/baylock/32/31817_2.png) [@Baylock](https://forum.babylonjs.com/u/Baylock)\
**Post date:** [April 28, 2023, 1:47am UTC](https://forum.babylonjs.com/t/solved-camera-attachcontrol-not-working/40318/1 "2023-04-28T01:47:48Z")

</div>

Hi,

I’m testing Babylon.js functionnalities and i’m trying to achieve exactly this in terms of camera control :

> **[Babylon.js Playground](https://playground.babylonjs.com/#29ADSV)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

But I just can’t have the camera.attachControl working in my local project (everything else is working).

Here is my code:

```auto
const canvas = document.getElementById("canvas");
      canvas.width = 3840;
      canvas.height = 2160;

const engine = new BABYLON.Engine(canvas);
      engine.setSize(3840,2160);
      engine.runRenderLoop(renderLoop);

const scene = new BABYLON.Scene(engine);
      scene.clearColor = new BABYLON.Color3(0.95, 0.95, 0.95);

const back = new BABYLON.Layer('back','../assets/images/background.jpg', scene, true);

const camera = new BABYLON.FreeCamera("camera",new BABYLON.Vector3(0, 0, -10),scene);
      camera.attachControl(canvas, true,true)

const light = new BABYLON.HemisphericLight("Light", new BABYLON.Vector3(0, 2, -1), scene);

const box = new BABYLON.MeshBuilder.CreateBox("box", { width:2, height:2, depth:2 }, scene);
      box.material = new BABYLON.StandardMaterial("material", scene);;
      box.material.diffuseColor = new BABYLON.Color3.FromHexString("#404655");
      box.rotation.x = 0
      box.rotation.y = 0
      box.rotation.z = 0

function renderLoop() {
      scene.render();
      box.rotation.x += 0.015;
      box.rotation.y += 0.015;
}

```

I tried to do the same on the playground and it kind of works.It rotates alright (very loosely) but doesn’t pan or zoom.

> **[Babylon.js Playground](https://playground.babylonjs.com/#CM5PIU)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

Basically, we are far from the reference playground I mentioned earlier.  
But it works.

Still, I don’t get why it doesn’t work on my localhost at all (Chrome canary or Firefox).

Here are the js files that are imported in my index.html:

```auto
    <script src="https://cdn.babylonjs.com/babylon.js"></script>
    <script src="https://cdn.babylonjs.com/materialsLibrary/babylonjs.materials.min.js"></script>
    <script src="https://cdn.babylonjs.com/loaders/babylonjs.loaders.min.js"></script>
    <script src="https://cdn.babylonjs.com/postProcessesLibrary/babylonjs.postProcess.min.js"></script>
    <script src="https://cdn.babylonjs.com/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js"></script>
    <script src="https://cdn.babylonjs.com/serializers/babylonjs.serializers.min.js"></script>

```

Thanks for your help.

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [April 28, 2023, 11:33am UTC](https://forum.babylonjs.com/t/solved-camera-attachcontrol-not-working/40318/2 "2023-04-28T11:33:43Z")

</div>

> [@Baylock](#):
>
> It rotates alright (very loosely) but doesn’t pan or zoom.

Try to use an arc rotate camera instead of a free camera. The PG does work as expected for me.

Are you able to setup a live link of your project so that we can test? Without some kind of repro it may be difficult to find the problem.

---

<div class="post-metadata">

**Author:** ![Baylock](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/baylock/32/31817_2.png) [@Baylock](https://forum.babylonjs.com/u/Baylock)\
**Post date:** [April 28, 2023, 1:11pm UTC](https://forum.babylonjs.com/t/solved-camera-attachcontrol-not-working/40318/3 "2023-04-28T13:11:43Z")

</div>

Thank you for your help.  
While trying to make a consolidated html file to provide to you, I found the culprit.  
There was an overlay on my canvas that prevented me from interacting with it.  
As simple as that but not so obvious at first glance.  
And yes, the arcRotate camera solved the rest of it.  
So, this is totally resolved.  
Thank you very much.