GLTransitions

GLTransitions is an open source WebGL transition library that contains a large number of transitions, all of which can be used in AsTransition

Install

yarn add gl-transitions

<script src="https://unpkg.com/gl-transitions/gl-transitions.js"></script>

Usage

transition

• Assign GLTransitions[x].glsl to shader
• Assign GLTransitions[x].defaultParams to uniforms, the parameters can be modified according to the requirements

export interface Transition {
  shader?: string
  uniforms?: Record<string, any>
}

<script>
import GLTransitions from "gl-transitions";
</script>
<template>
  <AsTransition
    :transition="{
      shader: GLTransitions[0].glsl,
      uniforms: GLTransitions[0].defaultParams
    }"
    ...
  </AsTransition>
</template>

Example

Click to change transition effects