Home Linux HTML/CSS PHP React VR Blog PHP Fiddle

Changing the Panoramic Image








Quick Copy Boxes

Related Blog:
JavaScriptReact VRPano Image

React VR is a JavaScript framework used to create Virtual Reality applications. Let's practice changing the panoramic (Pano) image.

Visit Setting up React VR to set up.

This lesson was inspired by a workshop I attended: ReactVR - a VR Workshop with Javascript. Thank you to Praveen Yalamanchi and Damian Montero.


Step 1: Google

Look for the panoramic image that you want to use.

Step 2: Save in static assets

Save the image in the static-assets directory.


Step 3: Edit Code

In the example below, I am changing the image to water-view.jpeg.


render() {
	return (
		<View>
			<Pano source={asset('water-view.jpeg')}></Pano>
		</View>
	)
}
};
    

water-view.jpeg - I edited the render function to return the panoramic image called water-view.jpeg.


Below Photo by Pok Rie from Pexels






Color Selector



Hex:


RBG:


If you find my tutorials helpful, please consider donating to support my free web development resources.

The more money I raise, the more content I can produce.

Thank you,
Commander Candy

DONATE


Back to Exercise 2 | Continue to Exercise 4