Knowledge Base
Recent Changes

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision 		Previous revision
dev:developer:examples:addviewwithoptions [2020/02/03 20:49]
jeroen 		dev:developer:examples:addviewwithoptions [2020/05/12 17:59]
jeroen removed
Line 1: Line 1:
 ====== Example addViewWithOptions ===== ====== Example addViewWithOptions =====
  
-The preset longitude/latitude coordinate point to a location of the demo publication “San Sebastian”. Open this demo publication via the token you find on https://3dmapping.cloud/try-it-now/+The preset longitude/latitude coordinate point to a location of the demo publication “San Sebastian”. \\ 
 +Open this demo publication via the token you find on https://3dmapping.cloud/try-it-now/
  
 <html> <html>
  <head>  <head>
-        <meta charset="utf-8"> 
  <script src="https://cdn.3dmapping.cloud/20.2.0/javascript/orbitgt_3dm_sdk.js"></script>  <script src="https://cdn.3dmapping.cloud/20.2.0/javascript/orbitgt_3dm_sdk.js"></script>
- <style rel="stylesheet" type="text/css"> 
- body { 
- padding: 0; 
- margin: 0; 
- } 
- </style> 
  </head>  </head>
  
Line 20: Line 14:
         <span style="padding-left: 10px; display: flex; flex-direction: column; width: 200px; align-content: flex-start;">         <span style="padding-left: 10px; display: flex; flex-direction: column; width: 200px; align-content: flex-start;">
             <label for="lon">Longitude</label>             <label for="lon">Longitude</label>
-            <input id="lon" type="number" value="4.01174023"/>+            <input id="lon" type="number" value="-1.98083224"/>
             <label for="lat">Latitude</label>             <label for="lat">Latitude</label>
-            <input id="lat" type="number" value="51.08718225"/> +            <input id="lat" type="number" value="43.32598276"/> 
-            <label for="rendermode"></label> +            <label for="rendermode">Render Mode</label> 
-            <select id="rendermode" value="3d">+            <select id="rendermode" value="photo_spherical">
                 <option value="3d">3D</option>                 <option value="3d">3D</option>
                 <option value="photo_spherical">Spherical</option>                 <option value="photo_spherical">Spherical</option>
-                <option value="photo_uav">UAV Planar</option> 
-                <option value="photo_streetlevel">Streetlevel Planar</option> 
-                <option value="photo_oblique">Oblique</option> 
             </select>             </select>
             <label for="clear">Close other views?</label>             <label for="clear">Close other views?</label>
Line 41: Line 32:
             <label for="fov-driving-direction">Driving direction?</label>             <label for="fov-driving-direction">Driving direction?</label>
             <input id="fov-driving-direction" type="checkbox" checked="false" />             <input id="fov-driving-direction" type="checkbox" checked="false" />
-            <label for="focus-button"></label>+            <label for="focus-button">Action</label>
             <input id="focus-button" type="button" value="Add View" />             <input id="focus-button" type="button" value="Add View" />
-            <span style="padding: 10px"> 
-                Default location: Orbit Office Lokeren. 
-            </span> 
         </span>         </span>
  </span>  </span>
Line 54: Line 42:
          * Example:           * Example: 
          *  - Add new view with setting (pan, tilt and fov)          *  - Add new view with setting (pan, tilt and fov)
-         * 
          */           */ 
  
Line 66: Line 53:
         function handleFocus(event) {         function handleFocus(event) {
             let lon = parseFloat(document.getElementById("lon").value);             let lon = parseFloat(document.getElementById("lon").value);
-     let lat = parseFloat(document.getElementById("lat").value);+            let lat = parseFloat(document.getElementById("lat").value);
             let position = Coordinate.fromXY("4326",lon,lat);             let position = Coordinate.fromXY("4326",lon,lat);
             let renderMode = document.getElementById("rendermode").value;             let renderMode = document.getElementById("rendermode").value;
Line 74: Line 61:
             let fovValue = parseFloat(document.getElementById("fov").value);             let fovValue = parseFloat(document.getElementById("fov").value);
             let fovDrive = document.getElementById("fov-driving-direction").checked;             let fovDrive = document.getElementById("fov-driving-direction").checked;
- 
             let fov = fovDrive ? "driving_direction" : fovValue;             let fov = fovDrive ? "driving_direction" : fovValue;
             if (isNaN(fov)) fov = undefined;             if (isNaN(fov)) fov = undefined;
- 
             let options = new AMap();             let options = new AMap();
             options.set(Constants.STARTUP_PAN, pan);             options.set(Constants.STARTUP_PAN, pan);
Line 114: Line 99:
             var appElement = document.getElementById("m3dviewer");             var appElement = document.getElementById("m3dviewer");
             viewer = new SDKViewer("example application",appElement,options);             viewer = new SDKViewer("example application",appElement,options);
-            viewer.setSize(800,400);+            viewer.setSize(1000,500);
             viewer.isReady.then(handleReady);             viewer.isReady.then(handleReady);
         }         }