<template>
	<view>
		<view class="ThreeJSCity">
			<!-- <model-obj class="ThreeDShow"   src="../../static/5.obj"   mtl="../../static/5.mtl" ></model-obj> -->
			<!-- :background-alpha="alpha" :lights="lights"-->
		</view>
	</view>
</template>

<script>
	// import { ModelStl,ModelObj  } from 'vue-3d-model'
	export default {
		data() {
			return {
				alpha: 0,
				lights: [{
				        type: 'HemisphereLight',
				        position: {x: 0, y: 1, z: 0},
				        skyColor: 0xffffff,
				        // groundColor: 0xFF0000, // 此代码为灯光后颜色
				        intensity: 1,
				      },
				        {
				          type: 'DirectionalLight',
				          position: {x: 1, y: 1, z: 1},
				          color: 0xffffff,
				          intensity: .7,
				        }]
			};
		},
		components: { ModelStl ,ModelObj},
	}
</script>

<style lang="scss">
.ThreeJSCity {
	  width: 750upx;
	  height: 100vh;
	  // border:1px solid red;
	  background: url('../../../../static/bg-3d.png') no-repeat;
	  background-size: 100% 100%;
	  // z-index:0;
	  // background: #fff;
	  .ThreeDShow {
	    width: 750upx;
	    height: 750upx;
		
	  }
	}
</style>
