diff --git a/src/views/AppThreeMap.vue b/src/views/AppThreeMap.vue
index f0e42ff..6186062 100644
--- a/src/views/AppThreeMap.vue
+++ b/src/views/AppThreeMap.vue
@@ -250,7 +250,7 @@ export default {
          * @desc 创建相机
          * */
         setCamera() {
-          this.camera = new THREE.PerspectiveCamera(10, rootEl.innerWidth / rootEl.innerHeight, 1, 2000);
+          this.camera = new THREE.PerspectiveCamera(10, rootEl.offsetWidth / rootEl.offsetHeight, 1, 2000);
           this.camera.up.x = 0;
           this.camera.up.y = 0;
           this.camera.up.z = 1;
@@ -262,17 +262,18 @@ export default {
          * @desc 创建渲染器
          * */
         setRenderer() {
+          console.log(rootEl.offsetWidth, rootEl.offsetHeight)
           this.renderer = new THREE.WebGLRenderer({antialias: true});
           this.renderer.setPixelRatio(window.devicePixelRatio * 1);
           this.renderer.sortObjects = true; // 渲染顺序
           this.renderer.setClearColor('#212121');
-          this.renderer.setSize(rootEl.innerWidth, rootEl.innerHeight);
+          this.renderer.setSize(rootEl.offsetWidth, rootEl.offsetHeight);
           rootEl.appendChild(this.renderer.domElement);
 
           function onWindowResize() {
-            this.camera.aspect = rootEl.innerWidth / rootEl.innerHeight;
+            this.camera.aspect = rootEl.offsetWidth / rootEl.offsetHeight;
             this.camera.updateProjectionMatrix();
-            this.renderer.setSize(rootEl.innerWidth, rootEl.innerHeight);
+            this.renderer.setSize(rootEl.offsetWidth, rootEl.offsetHeight);
           }
 
           rootEl.addEventListener('resize', onWindowResize.bind(this), false);
@@ -303,8 +304,8 @@ export default {
           let that = this;
 
           function onMouseMove(event) {
-            const x = (event.clientX / rootEl.innerWidth) * 2 - 1; //标准设备横坐标
-            const y = -(event.clientY / rootEl.innerHeight) * 2 + 1; //标准设备纵坐标
+            const x = (event.clientX / rootEl.offsetWidth) * 2 - 1; //标准设备横坐标
+            const y = -(event.clientY / rootEl.offsetHeight) * 2 + 1; //标准设备纵坐标
             const standardVector = new THREE.Vector3(x, y, 0.5); //标准设备坐标
             //标准设备坐标转世界坐标
             const worldVector = standardVector.unproject(that.camera);
@@ -349,16 +350,8 @@ export default {
           // window.addEventListener('mousemove', onMouseMove, false);
         }
 
-        /**
-         * @desc 创建地面函数
-         * */
         makeGround() {
-          const maps = new THREE.TextureLoader().load("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAIACAYAAAD0eNT6AAAInUlEQVR4nO3ZMQ7CMBAAwQTlSfn/C/iT6SKEKHEC7ExnCeXceXWsY4yxnGM/aQ4A/Lr77AG32QMAgO8jAAAgaHs5r5fcAgB4Nus9Pv72twEAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAgrZlWfarLwEAnOJ4820AACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAggQAAAQJAAAIEgAAECQAACBIAABAkAAAgCABAABBAgAAgtYxxng+X3YTAGC24823AQCAIAEAAEECAACCBAAABAkAAAgSAAAQJAAAIEgAAECQAACAIAEAAEECAACCBAAABAkAAAgSAAAQJAAAIGh7OY+3v/qMfeK3AeCf3GcPsAEAgCABAABBD+KuEWUfb+G0AAAAAElFTkSuQmCC");
-          maps.wrapS = maps.wrapT = THREE.RepeatWrapping;
-          maps.repeat.set(14, 14); // 纹理 y,x方向重铺
-          maps.needsUpdate = false; // 纹理更新
           let material = new THREE.MeshBasicMaterial({
-            // map: maps,
             opacity: 1,
             transparent: true,
             color: '#07193D'