three实现照片变成三维圆球动画效果代码-html代码-BFW代码库

three实现照片变成三维圆球动画效果代码

代码语言：html

所属分类：三维

代码描述：three实现照片变成三维圆球动画效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>

  <meta charset="UTF-8">

  
  
  
<style>
body {
  margin: 0;
  overflow: hidden;
}
</style>



</head>

<body>
  <canvas id="webgl-canvas"></canvas>

<!-- vertexShader -->
<script id="js-vertex-shader" type="x-shader/x-vertex">
attribute vec3 position;
attribute vec3 spherePosition;
attribute vec4 color;
attribute vec2 texCoord;
uniform mat4 projectionMatrix;
uniform mat4 viewMatrix;
uniform mat4 modelMatrix;
uniform float time;
varying vec4 vColor;
varying vec2 vTexCoord;

void main()	{
  vColor = color;
  vTexCoord = texCoord;
  
  float s = (sin(time) + 1.0) * 0.5;
  
  vec3 p = mix(position, spherePosition, s);
  
  gl_Position = projectionMatrix * viewMatrix * modelMatrix * vec4(p, 1.0);
  gl_PointSize = 4.0;
}
</script>

<!-- fragmentShader -->
<script id="js-fragment-shader" type="x-shader/x-fragment">
precision mediump float;
uniform sampler2D textureUnit;
varying vec4 vColor;
varyin.........完整代码请登录后点击上方下载按钮下载查看