three.js 2d和3d顶点相互转换

时间:2016-08-05 12:26:05

标签: three.js

请参阅此jsfiddle;

init();

var camera, scene, renderer;

function init() {
  container = document.createElement('div');
  document.body.appendChild(container);
  var camera_cylinder_setting = '[0.9985033869743347, 0.02076610177755356, 0.05059404298663139, 0, 0.0047478810884058475, 0.8886997103691101, -0.4584651291370392, 0, -0.05448344349861145, 0.4580191969871521, 0.8872711062431335, 0, -0.5448344349861145, 4.5801920890808105, 8.872710227966309, 1]';

  camera = new THREE.OrthographicCamera(512 / -2, 512 / 2, 512 / 2, 512 / -2, -512, 512);
  camera.matrix.fromArray(JSON.parse(camera_cylinder_setting));
  camera.matrix.decompose(camera.position, camera.quaternion, camera.scale);

  renderer = new THREE.WebGLRenderer();
  renderer.setClearColor(0xf0f0f0);
  renderer.setPixelRatio(window.devicePixelRatio);
  renderer.setSize(512, 512);
  container.appendChild(renderer.domElement);
  scene = new THREE.Scene();
  var geometry = new THREE.CylinderGeometry(118, 158, 383, 30, 30, true, 3.3, 6.3);
  var loader = new THREE.TextureLoader();
  object = new THREE.Mesh(geometry, new THREE.MeshBasicMaterial({
    color: Math.random() * 0xffffff,
    opacity: 0.5
  }));
  object = new THREE.Mesh(geometry);
  loader.load('https://farm9.staticflickr.com/8829/28748679526_16d6e56b84_b.jpg', function(texture) {
    texture.offset = new THREE.Vector2(0.3, 0.1);
    var material = new THREE.MeshBasicMaterial({
      overdraw: 1,
      map: texture
    });

    object.material = material;
    scene.add(object);
    renderer.render(scene, camera);
  });
}

我想知道什么,以获得符合原始图像的红色矩形的贪婪矩形? 相反,如何根据绿色矩形获得红色rectangel?

非常感谢你!

0 个答案:

没有答案