zoom view functions

README.md

@@ -114,6 +114,22 @@ if the file is already loaded by other modules, you should use the `.parse(jsonD
 parse the json Data.
 if the jsonData is loaded by other modules, you can just use this function to pass it to the indoor map
 
+**.setDefaultView()**
+
+reset the camera to default view (Default perspective view for a 3d map and default top view for a 2d map)
+
+**.setTopView()**
+
+set the camera to the top view. this function is only valid in the 3d map.
+
+**.zoomIn(zoomScale)**
+
+zoom in. zoom Scale is not necessary. so you can just call .zoomIn()
+
+**.zoomOut(zoomScale)**
+
+zoom out. Same as the zoomIn() function, zoom Scale is not necessary.
+
 **.adjustCamera**
 
 Resets the camera to its default settings. This function is called when switching floors

css/indoor3D.css

@@ -27,7 +27,8 @@
     padding: 0;
 }
 
-.floorsUI li{
+.floorsUI li, .testButton{
+    max-width: 100px;
     padding: 10px;
     background-color: #e8e8e8 ;
     border: 1px solid #bbbbbb;

index.html

@@ -22,7 +22,7 @@
     animate();
 
     var params = {
-        mapDiv:"indoor3d",
+        mapDiv:"indoor3d"
     }
     var indoorMap = new IndoorMap(params);
     indoorMap.load('data/B000A9R4FE.json', function(){
@@ -39,6 +39,10 @@
     }
 
 </script>
-</body>
+<div class = "testButton" onclick="indoorMap.setTopView()">顶视图</div>
+<div class = "testButton" onclick="indoorMap.setDefaultView()">默认透视图</div>
+<div class = "testButton" onclick="indoorMap.zoomIn(0.8)">放大</div>
+<div class = "testButton" onclick="indoorMap.zoomOut(0.8)">缩小</div>
 
+</body>
 </html>

js/IndoorMap.js

@@ -541,7 +541,7 @@ var IndoorMap = function (params) {
         light.position.set(500, 500, 500);
         _scene.add(light);
 
-        _this.resetCamera();
+        _this.setDefaultView();
         _renderer.setSize(_mapDiv.clientWidth, _mapDiv.clientHeight);
         _canvasDiv = _renderer.domElement
         _mapDiv.appendChild(_canvasDiv);
@@ -579,7 +579,7 @@ var IndoorMap = function (params) {
     }
 
     //reset the camera to default configuration
-    this.resetCamera = function () {
+    this.setDefaultView = function () {
         if(_this.is3d) {
             _this.camera.position.set(0, 150, 400);//TODO: adjust the position automatically
         }else{
@@ -589,12 +589,24 @@ var IndoorMap = function (params) {
         _controls.reset();
     }
 
+    this.setTopView = function(){
+        _this.camera.position.set(0, 500, 0);
+    }
+
     //TODO:adjust camera to fit the building
     this.adjustCamera = function() {
-        _this.resetCamera();
+        _this.setDefaultView();
         _controls.viewChanged = true;
     }
 
+    this.zoomIn = function(zoomScale){
+        _controls.zoomOut(zoomScale);
+    }
+
+    this.zoomOut = function(zoomScale){
+        _controls.zoomIn(zoomScale);
+    }
+
     //resize the map
     this.resize = function (width, height){
         if(_fullScreen) {
@@ -621,7 +633,11 @@ var IndoorMap = function (params) {
 
     //show the labels
     this.showLabels = function(showLabels) {
-        _showLabels = showLabels;
+        if(showLabels == undefined){
+            _showLabels = true;
+        }else {
+            _showLabels = showLabels;
+        }
 
         if(_this.mall == null){ //if the mall hasn't been loaded
             return;
@@ -631,6 +647,7 @@ var IndoorMap = function (params) {
                 if(fid != 0) {
                     createLabels(fid);
                     _labelsRoot.style.display = "inline";
+                    updateLabels();
                 }
             } else {
                 if(_labelsRoot != null) {