KITASENJU DESIGN BLOG

memo, html, javascript, unity

MindARのVideo

MindAR( https://hiukim.github.io/mind-ar-js-doc/ )では、画面の長辺に合わせてカメラからのビデオがトリミングされている。(videoタグのpositionなどが変更されている)

そこで、全画面のquadを作っていてその際、以下の様にサイズを変えた。

    this.uniforms['_size'].value.x 
    = parseFloat(this.video.style.width)/parseFloat(window.innerWidth);
    this.uniforms['_size'].value.y 
    = parseFloat(this.video.style.height)/parseFloat(window.innerHeight);
    
varying vec2 vUv;
varying vec4 vWorldPosition;
varying vec3 vNormal;
uniform vec2 _size;
void main()
{
  vUv = uv;
  vNormal = normal;
  vWorldPosition = modelMatrix * vec4(position, 1.0);
  
  vec2 pos = position.xy;
  pos.x*=_size.x;
  pos.y*=_size.y;

  //vec4 mvPosition = modelViewMatrix * vec4(position, 1.0);
  //gl_Position = projectionMatrix * mvPosition;
  gl_Position = vec4(pos,0.99999,1.0);


}
"FOOTER"