...
This library is available through autosyncstudio.com website.
There are two version:
Javascript module
https://vvs.autosyncstudio.com/lib/autosync-spin.module.js – recommended for JavaScript frameworks or websites built with NodeJS.Plain old JavaScript file
https://vvs.autosyncstudio.com/lib/autosync-spin.js – recommended in all other cases
2. How to Use It
1. Initialization
Import the library.
Create a
divto use it as a container and assign anidto it.Instantiate
AutosyncSpinpassing a config object with theid, along with a path to spin images and a desired size.
For example:
| Code Block | ||
|---|---|---|
| ||
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Example</title>
<script src="https://vvs.autosyncstudio.com/lib/autosync-spin.js"></script>
</head>
<body>
<div id="spin-360-viewer"></div>
<script>
const autosyncSpin = new AutosyncSpin({
id: 'spin-360-viewer',
path: 'https://storage.googleapis.com/autosync-tire-_tires/_spins/06026e3d311e72c7df6193ba5efd5f2e',
size: 500,
});
</script>
</body>
</html>
|
...
id– The id assigned to the container.path– An absolute URL (or a relative path under the same domain) where images are stored. All the images used for this library must be named from 1 to (24 or 36) and be in WebP format.size– The desired size of the viewer(in pixels).
...
3.
...
Method Reference
The library comes with utility methods to interact with its rendered content.
...