Skip to content
A shader to display GIF for A-Frame VR.
JavaScript
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist dist Apr 2, 2019
examples
lib 87a GIFs aren't supported by @Danpollak Apr 2, 2019
.babelrc first commit Apr 17, 2016
.gitignore first commit Apr 17, 2016
LICENSE first commit Apr 17, 2016
README.md readme Apr 2, 2019
example.gif readme Apr 2, 2019
index.js Fix for edge case when gif data is invalid by @UXVirtual Apr 2, 2019
package.json 0.9.1 Apr 2, 2019
webpack.config.js first commit Apr 17, 2016

README.md

AFrame GIF Shader

A gif shader for A-Frame VR. Inspired by @gtk2k's awesome sample.

To control, please use aframe-gif-component.

DEMO

example

Now transparent gif are supported! 🎉🎊

Properties

  • Basic material's properties are supported.
  • The property is pretty much same as flat shader.
Property Description Default Value
src image url. @see Textures null
autoplay play automatecally once it's ready true

For refference, please check the following links:

Usage

Browser Installation

Install and use by directly including the browser files:

<head>
  <title>My A-Frame Scene</title>
  <script src="https://aframe.io/releases/0.9.0/aframe.min.js"></script>
  <script src="https://rawgit.com/mayognaise/aframe-gif-shader/master/dist/aframe-gif-shader.min.js"></script>
</head>

<body>
  <a-scene>
    <a-entity geometry="primitive:box;" material="shader:gif;src:url(nyancat.gif);color:green;opacity:.8"></a-entity>
  </a-scene>
</body>

NPM Installation

Install via NPM:

npm i -D aframe-gif-shader

Then register and use.

import 'aframe'
import 'aframe-gif-shader'

Contributors

Thank you so much 🙏

You can’t perform that action at this time.