Browse Source

:art: optimize: preview

shiqi.li 6 years ago
parent
commit
77e57bb2e8
5 changed files with 36 additions and 11 deletions
  1. 6 6
      examples/index.js
  2. 27 2
      examples/page2.html
  3. 1 0
      origin/tpanorama.js
  4. 1 3
      src/component/tpanorama.js
  5. 1 0
      src/component/tpanoramaSetting.js

+ 6 - 6
examples/index.js

@@ -1,20 +1,20 @@
-var { tpanorama } = require('../lib/index.js');
+var { tpanorama } = require('../src/index.js');
 var opt, tp;
 window.onload = function () {
   opt = {
     container: 'panoramaConianer',//容器
     url: 'img/p3.png',
     lables: [
-      { position: { lon: -72.00, lat: 9.00 }, logoUrl: '', text: '蓝窗户' },
-      { position: { lon: 114.12, lat: 69.48 }, logoUrl: '', text: '一片云彩' },
-      { position: { lon: 132.48, lat: -12.24 }, logoUrl: '', text: '大海' }
+      { position: { lon: -72.00, lat: 9.00 }, logoUrl: 'img/logo.png', text: '蓝窗户' },
+      { position: { lon: 114.12, lat: 69.48 }, logoUrl: 'img/logo.png', text: '一片云彩' },
+      { position: { lon: 132.48, lat: -12.24 }, logoUrl: 'img/logo.png', text: '大海' }
     ],
     widthSegments: 60,//水平切段数
     heightSegments: 40,//垂直切段数(值小粗糙速度快,值大精细速度慢)
     pRadius: 1000,//全景球的半径,推荐使用默认值
     minFocalLength: 6,//镜头最a小拉近距离
     maxFocalLength: 100,//镜头最大拉近距离
-    showlable: 'show' // show,click
+    showlable: 'click' // show,click
   }
   tp = new tpanorama(opt);
 }
@@ -32,4 +32,4 @@ function changeImg(name) {
   }
   opt.url = 'img/' + name + '.png';
   tp.render(opt);
-}
+}

+ 27 - 2
examples/page2.html

@@ -14,7 +14,7 @@
     </style>
 
     <script>
-        var opt, s;
+        var opt, s, img;
         window.onload = function () {
             //默认参数
             opt = {
@@ -54,12 +54,35 @@
             if (name == "p4") {
                 opt.lables = [{ lon: 48.96, lat: -20.16, text: '樱花' }]
             }
-            opt.imgUrl = 'img/' + name + '.png';
+            img = 'img/' + name + '.png';
+            opt.imgUrl = img;
             s.clean();
             s.config(opt);
             s.init();
         }
 
+        function preview() {
+            document.getElementById('set').innerHTML = '';
+            var lables = s.getAllLables();
+            s.clean();
+            lables = lables.map((l) => ({
+                position: { lon: l.lon, lat: l.lat },
+                text: l.text
+            }))
+            opt = {
+                container: 'set',//容器
+                url: img || 'img/p3.png',
+                lables: lables,
+                widthSegments: 60,//水平切段数
+                heightSegments: 40,//垂直切段数(值小粗糙速度快,值大精细速度慢)
+                pRadius: 1000,//全景球的半径,推荐使用默认值
+                minFocalLength: 6,//镜头最小拉近距离
+                maxFocalLength: 100,//镜头最大拉近距离
+                showlable: 'show' // show,click
+            }
+            tp = new tpanorama(opt);
+        }
+
 
     </script>
 </head>
@@ -72,6 +95,8 @@
 
     <button onclick="getAll()">获取所有标记</button>
     &nbsp;&nbsp;
+    <button onclick="preview()">预览</button>
+    &nbsp;&nbsp;
     <button onclick="changeImg('p1')">图1</button>
     &nbsp;&nbsp;
     <button onclick="changeImg('p2')">图2</button>

+ 1 - 0
origin/tpanorama.js

@@ -445,6 +445,7 @@
             }
         },
         clean: function () {
+            document.onmousemove = () => { }
             document.getElementById(this.def.container).innerHTML = '';
         }
     }

+ 1 - 3
src/component/tpanorama.js

@@ -324,10 +324,8 @@ function worldPostion2Screen(world_vector, camera) {
 
 
 function runRender() {
-  _renderer.clear();
   _renderer.render(_scene, _camera);
-  _renderer.clearDepth();
   _renderer.render(_sceneOrtho, _cameraOrtho);
 }
-window.tpanorama = tpanorama;
+
 module.exports = tpanorama;

+ 1 - 0
src/component/tpanoramaSetting.js

@@ -112,6 +112,7 @@ panoramaSetting.prototype = {
     }
   },
   clean: function () {
+    document.onmousemove = () => { };
     document.getElementById(this.def.container).innerHTML = '';
   }
 }