components/layer/symbolLayer3D.js

/*``
 * @Author: lc
 * @Date:   2017-04-20 17:03:05
 * @Last Modified by:   hydata
 * @Last Modified time: 2018-05-10 16:03:10
 * @Email: 304861063@qq.com
 * @File Path: F:\work\hyMap\src\components\layer\buildingLayer.js
 * @File Name: clustersLayer.js
 * @Descript:加载three模型图层
 */
import * as THREE from 'three';
import baseLayer from './baseLayer';
// import Threebox from '../../threebox/threebox';


/**
 * 3d图标层
 * @extends base
 */
 class SymbolLayer3D extends baseLayer {
    /**
     * 
     * @param {*} options 
     */
    constructor(options) {

        super(options);
        this.data = options.serie;
        this.id = options.serie.id;
        this.threebox = options.threebox;
        this.init(options.serie);


    }

    /**
     * 初始化
     * @param {*} serie 
     */
    init(serie) {

        // console.log(serie, 'serie');
        this.threebox.setupDefaultLights();
        this.threebox.addSymbolLayer({
            id: 'trucks',
            source: serie.data,
            modelName:  serie.symbolStyle.normal.modelName,    // will look for an .obj and .mtl file with this name
            modelDirectory: serie.symbolStyle.normal.modelDirectory,          // in this directory
            rotation: {generator: feature => (new THREE.Euler(Math.PI / 2, 0, feature.properties['heading'] * Math.PI / 180 + Math.PI / 2, 'ZXY'))},
            scale: {property: 'size'},
            scaleWithMapProjection: true,
            key: {property: 'id'}
        });

    }
}

export default SymbolLayer3D