# Setting center/eye in Plotly.js (React Plotly)

**URL:** <https://community.plotly.com/t/setting-center-eye-in-plotly-js-react-plotly/89236>\
**Category:** plotly.js\
**Tags:** question\
**Created:** [December 7, 2024, 10:07am UTC](https://community.plotly.com/t/setting-center-eye-in-plotly-js-react-plotly/89236 "2024-12-07T10:07:09Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![khoan](https://avatars.discourse-cdn.com/v4/letter/k/4da419/32.png) [@khoan](https://community.plotly.com/u/khoan)\
**Post date:** [December 7, 2024, 10:07am UTC](https://community.plotly.com/t/setting-center-eye-in-plotly-js-react-plotly/89236/1 "2024-12-07T10:07:09Z")

</div>

## Setting center/eye in Plotly.js (React Plotly)

Hey folks, I’m banging my head against the wall trying to get Plotly’s camera to behave. I’ve got a 3D scatter plot and I want clicking a point to center the view/rotation on that point.

I’ve tried:

```javascript
// Attempt #1: Direct camera update

setCamera({

center: {x: clickedPoint.x, y: clickedPoint.y, z: clickedPoint.z},

eye: {x: clickedPoint.x + 2, y: clickedPoint.y + 2, z: clickedPoint.z + 2},

up: {x: 0, y: 0, z: 1}

});

// Attempt #2: Using relayout

const plotElement = document.getElementsByClassName('js-plotly-plot')[0];

Plotly.relayout(plotElement, {

'scene.camera': {

center: {...},

eye: {...}

}

});

```

But the camera just zooms into weird places or flies off into space 🚀

The docs talk about camera properties but don’t really explain how to properly set the rotation center. Am I missing something obvious here?

Using:

- react-plotly.js

- React 18

- Latest Plotly
