read vertex position as pixel

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/95/three.min.js"></script>
<div class='container'></div>
<div class='info rgba'></div>
<div class='info xyz'></div>

CSS

body {
  margin: 0;
  overflow: hidden;
  color: #FFF;
  background-color: #000;
  font-family: monospace;
}

.container {
  position: absolute;
  top: 20px;
  left: 20px;
}

.info {
  position: absolute;
  top: 20px;
  left: 170px;
}

.info.xyz {
  left: 260px;
}

JavaScript

// pass vertex position to fragment
// render as texture and read pixels
// shouldn't R == X ?

var renderer, camera, scene, texture, geometry, material, buffer;

var width = 16;
var height = 16;

var scene2;
function init() {
	scene = new THREE.Scene();
	scene2 = new THREE.Scene();
	
  camera = new THREE.OrthographicCamera(width / -2, width / 2, height / 2, height / -2, -1, 1);
  
  renderer = new THREE.WebGLRenderer({ premultipliedAlpha: false });
  renderer.setSize(128, 128);
  document.querySelector('.container').appendChild(renderer.domElement);

  texture = new THREE.WebGLRenderTarget(width, height, { 
  	minFilter: THREE.NearestFilter,
    magFilter: THREE.NearestFilter,
    format: THREE.RGBAFormat,
    type: THREE.FloatType
  });
  
  material = new THREE.ShaderMaterial( {
    uniforms: { },
    vertexShader: `
    	varying vec4 vOut;
  
			void main() {
      	gl_Position = vec4(uv*2.-1.,0., 1.0);
        vOut = vec4(position, 1.0);
        vOut.x -= 0.5;
        vOut.y += 0.5;
			}
    `,
    fragmentShader: `
    	varying vec4 vOut;
    
    	void main() {
				gl_FragColor = vOut;
    	}
    `,
  });
  var material2 = new THREE.ShaderMaterial( {
    uniforms: { uTex:{value:texture} },
    vertexShader: `
    	varying vec2 vUv;
  
			void main() {
      vUv= uv;
      	gl_Position = vec4(position.xy,.0,1.);
			}
    `,
    fragmentShader: `
    	varying vec2 vUv;
      uniform sampler2D uTex;
    
    	void main() {
				gl_FragColor = texture2D(uTex,vUv);
        //gl_FragColor = vec4(vUv,0.,1.);
    	}
    `,
  });
  
  geometry = new THREE.PlaneBufferGeometry(width, height);

  var quad = new THREE.Mesh(geometry, material);
  scene.add(quad);
  
  var quad2 = new THREE.Mesh(new THREE.PlaneBufferGeometry(2,2,1,1), material2);
  scene2.add(quad2);
  
  buffer = new Float32Array(4 * width * height);
}

function animate() {
  requestAnimationFrame(animate);
  render();
  read();
}

function render() {
  renderer.render(scene, camera, texture, true);
 ...