gabolera / panolens.js

Javascript panorama viewer based on Three.js

Deprecated

This repository will be deprecated due to the rapidly evolving JavaScript ecosystem and the increasing difficulty of keeping up with the changes in the Three.js API.

Over the years, the Three.js library has undergone significant updates and improvements, introducing new features and optimizations. However, these advancements have also led to changes in the API, making it challenging for us to maintain this repository effectively.

We understand that this may be disappointing news for those who have relied on this repository for their projects. We apologize for any inconvenience this may cause.

To ensure that you can continue to benefit from the latest updates and improvements in the Three.js library, we recommend using the official Three.js documentation and resources. The official documentation provides comprehensive guides, examples, and API references to help you leverage the full potential of Three.js in your projects.

Here are some alternative resources that we recommend:

• Official Three.js Documentation
• Three.js GitHub Repository
• Three.js Discourse

We want to express our gratitude to the community for your support and contributions to this repository. We encourage you to migrate your projects to alternative solutions as there are many more Javascript-based panorama viewer nowadays compared to 2015.

This repository will remain available for historical purposes, but no further updates or bug fixes will be provided. We encourage you to fork this repository if you wish to continue maintaining it independently.

Thank you for your understanding and continued support.

Panolens.js

Javascript 360 Panorama Viewer

Panolens.js is an event-driven and WebGL based panorama viewer. Lightweight and flexible. It's built on top of Three.JS.

Examples — Documentation — Migration — FAQ

Usage

Include three.min.js and panolens.min.js

To find the correct supported versions, please check dependencies section in package.json or acess PANOLENS.VERSION or PANOLENS.THREE_VERSION at runtime.

<script src="js/three.min.js"></script>
<script src="js/panolens.min.js"></script>

The following code generates a 360 image panorama. The first panorama added to the viewer will be the entry point. To link panoramas, use panorama.link( other_panorama, new THREE.Vector3( X, Y, Z ) ) to connect the two.

const panorama = new PANOLENS.ImagePanorama( 'asset/equirectangular.jpg' );
const viewer = new PANOLENS.Viewer();
viewer.add( panorama );

Dependency

Panolens.js includes Tween.js by default, meaning TWEEN will be available with window object

How to contribute

Always make your contributions for the latest dev branch, not master, so it can be tracked for the next release.

Development

npm start

Build

npm run build-closure