arturbien / 3d-image

🏄 3D images on your website (just like those on Facebook!)

    ______                           _          ______                
   / ____/  ______  ___  ____  _____(_)   _____/_  __/___  __  _______
  / __/ | |/_/ __ \/ _ \/ __ \/ ___/ / | / / _ \/ / / __ \/ / / / ___/
 / /____>  </ /_/ /  __/ / / (__  ) /| |/ /  __/ / / /_/ / /_/ (__  ) 
/_____/_/|_/ .___/\___/_/ /_/____/_/ |___/\___/_/  \____/\__, /____/  
          /_/                                           /____/        

3d-image's Issues

Fallback to scroll-based movement if DeviceOrientation not available

iOS Safari has device sensors disabled by default. In such case (or when DeviceOrientation API is not supported ), fall back to scroll based image movement- when image appears in the viewport, animate vector values X and Y from -0.5 to 0.5 along some kind of bezier curve to achieve smooth parallax effect until image disappears from the viewport

Ugly edges when mouse is near border

One solution would be to add default styles to canvas and slightly zoom it in like so:

.image3D canvas {
    transform-origin: center;
    transform: scale(1.2);
}

this way the distorted image borders wouldt not be visible. Downside- not whole image will be visible

Cross-origin data error when loading page

I get the following error in the browser when trying to load a 3D-image as noted in the Readme.

Uncaught (in promise) DOMException: Failed to execute 'texImage2D' on 'WebGLRenderingContext': The image element contains cross-origin data, and may not be loaded.
    at h (https://unpkg.com/3d-image:1:3988)
    at e.default.<anonymous> (https://unpkg.com/3d-image:1:4161)
    at Generator.next (<anonymous>)
    at a (https://unpkg.com/3d-image:1:2145)

Do you know what might be causing that?

Next release ?

Hi,

Not an issue but a question.
The actual version available via npm is the 0.1.1 (4 month ago). Did you plan a next release date ?