lineTo3D/js/drawGeometry.js

let scene, camera, renderer, controls;
let stats = initStats();
let key = 'points', id = 'id';
let verticalLineAry = [];

/* 初始加载 */
(function () {
    console.log("three start...");
    init();
    animate();
    console.log("three end...");
})();

/**
 * 初始化函数
 */
function init() {
    initRenderer();
    initScene();
    initCamera();
    initLight();
    initControls();
    drawGeometry();
}

function drawGeometry() {
    if (!panorama_line_3d) {
        let geometry = new THREE.geometry
        console.log('panorama_line_3d未定义, 请检查');
        return;
    }

    let material = new THREE.LineBasicMaterial({
        color: 'red'
    })
    let geometry = new THREE.Geometry();

    // 第一层的面循环
    for (let i = 0; i < panorama_line_3d.length; i++) {
        let face = panorama_line_3d[i];

        if (face.length < 4) {
            console.log('构成面的线段数小于4, 请检查');
            return;
        }
        let sta = false;   // 用于控制寻找相同点还是不同点
        // 第二层面中的线循环
        for (let j = 0; j < face.length; j++) {
            if (!face[j][key] || face[j][key].length < 2) {
                console.log('线段' + face[j][id] + '的点数据有误, 请检查');
                return;
            }
            // 绘制第一条线段
            if (j === 0) {
                // 第一条线段, 先寻找不同点
                let firstPoint = findPoint(face[j][key], face[j + 1][key], false);
                verticalLineAry.push(findverticalLine(firstPoint));
                firstPoint && geometry.vertices.push(new THREE.Vector3(firstPoint[0], firstPoint[1], firstPoint[2]));
                // 再寻找相同点
                let secondPoint = findPoint(face[j][key], face[j + 1][key], true);
                verticalLineAry.push(findverticalLine(secondPoint));
                secondPoint && geometry.vertices.push(new THREE.Vector3(secondPoint[0], secondPoint[1], secondPoint[2]));
            } else if (j === face.length - 1) {  // 最后一条线段, 寻找与第一条线段相交的点
                let lastPoint = findPoint(face[j][key], face[0][key], true);
                verticalLineAry.push(findverticalLine(lastPoint));
                lastPoint && geometry.vertices.push(new THREE.Vector3(lastPoint[0], lastPoint[1], lastPoint[2]));
            } else {  // 寻找与上一条线段相交的点
                let point = findPoint(face[j][key], face[j + 1][key], true);
                verticalLineAry.push(findverticalLine(point));
                point && geometry.vertices.push(new THREE.Vector3(point[0], point[1], point[2]));
            }
        }

    }
    let line = new THREE.Line(geometry, material);
    scene.add(line);
    findIntersectLine();
}

/**
 * 
 * @param {*} point 
 */
function findverticalLine(point) {
    let lineAry = [];
    for(let i = 0; i < panorama_line_3d.length; i++) {
        for(let j = 0; j < panorama_line_3d[i].length; j++) {
            for(let k = 0; k < panorama_line_3d[i][j]['points'].length; k++) {
                let o_point = panorama_line_3d[i][j]['points'][k];
                if(arrayEquals(o_point, point)) {
                    lineAry.push(panorama_line_3d[i][j]['id']);
                }
            }
        }
    }
    // console.log(lineAry);
    return lineAry;
}



/**
 * 初始化渲染器
 */
function initRenderer() {
    renderer = new THREE.WebGLRenderer({
        antialias: true
    });
    renderer.setSize(window.innerWidth / 2, window.innerHeight);
    renderer.setClearColor("#ccc");
    renderer.shadowMap.enabled = true;
    let rightCav = document.getElementById('geo-cav');
    rightCav.appendChild(renderer.domElement);
    // canvas = renderer.domElement;
}

/**
 * 初始化场景
 */
function initScene() {
    scene = new THREE.Scene();
    // initContents();
}

/**
 * 初始化相机
 */
function initCamera() {
    camera = new THREE.PerspectiveCamera(
        45,
        0.5* window.innerWidth / window.innerHeight,
        1,
        100
    );
    // camera = new THREE.OrthographicCamera(3 / - 2, 3 / 2, 3 / 2, 3 / - 2, 1, 1000);
    camera.position.set(2.5, -2, 1);
    camera.up.x = 0;
    camera.up.y = 0;
    camera.up.z = 1;
    camera.lookAt(new THREE.Vector3(0, 0, 0));
}

/**
 * 初始化灯光
 */
function initLight() {
    let ambientLight = new THREE.AmbientLight(0x333333);
    let directionalLight = new THREE.DirectionalLight("#FFFAFA", 1);
    directionalLight.position.set(100, -200, 200);
    directionalLight.castShadow = true;
    scene.add(ambientLight);
    scene.add(directionalLight);
}

/**
 * 初始化控制器
 */
function initControls() {
    // TODO: 3D状态下启动控制器
    controls = new THREE.OrbitControls(camera, renderer.domElement);
}


/**
 * 初始化性能插件
 */
function initStats() {
    let stats = new Stats();
    stats.setMode(0);
    stats.domElement.style.position = "absolute";
    stats.domElement.style.left = "0";
    stats.domElement.style.top = "0";
    document.body.appendChild(stats.domElement);
    return stats;
}

/* 循环调用 */
function animate() {
    requestAnimationFrame(animate);
    renderer.render(scene, camera);
    update();
}

/* 更新数据 */
function update() {
    stats.update();
    controls.update();
}