# Rendering dynamic panoramic images

**URL:** <https://discourse.threejs.org/t/rendering-dynamic-panoramic-images/10238>\
**Category:** Questions\
**Tags:** panorama\
**Created:** [October 15, 2019, 10:38pm UTC](https://discourse.threejs.org/t/rendering-dynamic-panoramic-images/10238 "2019-10-15T22:38:46Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![fpolica91](https://avatars.discourse-cdn.com/v4/letter/f/9dc877/32.png) [@fpolica91](https://discourse.threejs.org/u/fpolica91)\
**Post date:** [October 15, 2019, 10:38pm UTC](https://discourse.threejs.org/t/rendering-dynamic-panoramic-images/10238/1 "2019-10-15T22:38:46Z")

</div>

Hello, I am trying to create a project using react and threejs. this would allow the user to upload an equirectangular image using a form, this image would be saved to cloudinary which would provide a secure\_url that I would use to dynamically set the threejs environment. Is this something that i achievable given the mentioned technologies?

---

<div class="post-metadata">

**Author:** ![Usnul](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/usnul/32/2355_2.png) [@Usnul](https://discourse.threejs.org/u/Usnul)\
**Post date:** [October 15, 2019, 10:49pm UTC](https://discourse.threejs.org/t/rendering-dynamic-panoramic-images/10238/2 "2019-10-15T22:49:17Z")

</div>

yes 🧜‍♀️

---

<div class="post-metadata">

**Author:** ![fpolica91](https://avatars.discourse-cdn.com/v4/letter/f/9dc877/32.png) [@fpolica91](https://discourse.threejs.org/u/fpolica91)\
**Post date:** [October 15, 2019, 10:57pm UTC](https://discourse.threejs.org/t/rendering-dynamic-panoramic-images/10238/3 "2019-10-15T22:57:41Z")

</div>

Would you be so kind to elaborate how something like this be done?

---

<div class="post-metadata">

**Author:** ![Usnul](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/usnul/32/2355_2.png) [@Usnul](https://discourse.threejs.org/u/Usnul)\
**Post date:** [October 15, 2019, 11:30pm UTC](https://discourse.threejs.org/t/rendering-dynamic-panoramic-images/10238/4 "2019-10-15T23:30:12Z")

</div>

Ha, well, okay. You did ask a very broad and loaded yes/no question. I suggest keeping your questions focused in the future. Otherwise you risk [doing this](https://discourse.threejs.org/t/please-help-solve-my-problem/9414).

So… there’s something called “environment map” in three.js - read documentation to learn what it is and how to use it - you will be 90% there in terms of technology.

If you need to edit the images in any way before you can submit them to a cube texture (that’s what environment map is basically) - you can dig around for a good image manipulation library on NPM, or you can just use canvas - if that suits you.

Loading images cross-domain - you will need to set up cors ([Cross-Origin Resource Sharing](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS))

that’s about all, things like camera and camera controller - that stuff you can learn by checking out examples.

have fun.

---

<div class="post-metadata">

**Author:** ![ToniFF](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/toniff/32/7604_2.png) [@ToniFF](https://discourse.threejs.org/u/ToniFF)\
**Post date:** [October 17, 2019, 2:08am UTC](https://discourse.threejs.org/t/rendering-dynamic-panoramic-images/10238/5 "2019-10-17T02:08:58Z")

</div>

[TextureLoader](https://threejs.org/docs/#api/en/loaders/TextureLoader) can load textures by url, you just need set up cors as `Usnul` said.