0.1.3 • Published 2 years ago
react-360-view-simple v0.1.3
react-360-view
- A Very Simple and Beautiful 360° Product Viewer built on React.js
- This is a simplied version of https://github.com/rajeevgade/react-360
Features
- 360° View
Installation
npm install react-360-view-simpleConfig
import ThreeSixty from 'react-360-view-simple'Example
<ThreeSixty
amount={36}
imagePath="https://scaleflex.cloudimg.io/width/600/q35/https://scaleflex.ultrafast.io/https://scaleflex.airstore.io/demo/chair-360-36"
fileName="chair_{index}.jpg?v1"
/>Adding a Header
<div class="v360-header text-light bg-dark">
<span class="v360-header-title">36 Images - Autoplay (1 loop) - Reverse Spin</span>
<span class="v360-header-description"></span>
</div>Props
| Name | Type | Description | Required | Default Value |
|---|---|---|---|---|
| amount | Number | Number of images | Yes | |
| imagePath | String | Path to your image | Yes | |
| fileName | String | File name format | Yes | |
| spinReverse | Boolean | Reverse Spin | Optional | false |
| boxShadow | Boolean | Apply Box Shadow Background | Optional | false |
| paddingIndex | Boolean | Apply Leading Zero to Image Index | Optional | false |