infographicstw/3Dsample.html

## 3Dsample.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>3Dsample</title>
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<link rel="stylesheet" type="text/css" href="./Qgis2threejs.css">
</head>
<body>
<div id="webgl"></div>

<!-- popup -->
<div id="popup" style="display:none;">
<div id="closebtn">&times;</div>
<div id="popupbar"></div>
<div id="popupbody">
 <div id="popupcontent"></div>
 <div id="pageinfo">
  <h1>Current View URL</h1>
  <div><input id="urlbox" type="text"></div>

  <h1>Usage</h1>
  <div id="usage"></div>

  <h1>About</h1>
  <div id="about">This page was made with <a href="http://www.qgis.org/" target="_blank">QGIS</a> and <a href="https://github.com/minorua/Qgis2threejs" target="_blank">Qgis2threejs</a> plugin,
and uses the following library:
  <ul>
  <li>three.js <a href="http://threejs.org/" target="_blank">http://threejs.org/</a> <a href="./threejs-LICENSE" target="_blank" class="license">(LICENSE)</a></li>
  <li>dat-gui <a href="https://code.google.com/p/dat-gui/" target="_blank">https://code.google.com/p/dat-gui/</a> <a href="./dat-gui-license.txt" target="_blank" class="license">(LICENSE)</a></li>
  <li id="lib_proj4js" style="display: none;">Proj4js <a href="http://trac.osgeo.org/proj4js/" target="_blank">http://trac.osgeo.org/proj4js/</a> <a href="./proj4js/LICENSE.md" target="_blank" class="license">(LICENSE)</a></li>
  </ul>
  </div>
 </div>
</div></div>

<!-- footer -->
<div id="footer"></div>

<script src="./three.min.js"></script>
<script src="./Qgis2threejs.js"></script>
<script src="./OrbitControls.js"></script>
<script>
var option = Q3D.Options;

</script>
<script src="./3Dsample.js"></script>
<script>
if (typeof proj4 !== "undefined") document.getElementById("lib_proj4js").style.display = "list-item";

var container = document.getElementById("webgl");
// initialize application
var app = Q3D.application;
app.init(container);

// load the project
app.loadProject(project);

app.addEventListeners();
app.start();

</script>
<script src="./dat.gui.min.js"></script>
<script src="./dat-gui_panel.js"></script>
<script>
// initialize dat-gui panel
Q3D.gui.init();
</script>
</body>
</html>

## 3Dsample.js
// Qgis2threejs Project
project = new Q3D.Project({crs:"EPSG:3826",wgs84Center:{lat:25.1515798915,lon:121.544788602},proj:"+proj=tmerc +lat_0=0 +lon_0=121 +k=0.9999 +x_0=250000 +y_0=0 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs",title:"3Dsample",baseExtent:[303194.902822,2781722.6881,306652.763633,2783633.26973],rotation:0,zShift:0.0,width:100.0,zExaggeration:1.5});

// Layer 0
lyr = project.addLayer(new Q3D.DEMLayer({q:1,shading:true,type:"dem",name:"twdtm_asterv2_30m-tm2_twd97"}));
bl = lyr.addBlock({width:673,plane:{width:100.0,offsetX:0,offsetY:0,height:55.2532833021},m:0,sides:true,height:372}, false);

## README.md

      
    Raw
  

              README.md
            
          
            View raw
              (Sorry about that, but we can’t show files that are this big right now.)
        
    
## dat-gui-LICENSE-2.0.txt

      
    Raw
  

              dat-gui-LICENSE-2.0.txt
            
          
            View raw
              (Sorry about that, but we can’t show files that are this big right now.)
        
    
## dat-gui_panel.js

      
    Raw
  

              dat-gui_panel.js
            
          
            View raw
              (Sorry about that, but we can’t show files that are this big right now.)
        
    
## dat.gui.min.js

      
    Raw
  

              dat.gui.min.js
            
          
            View raw
              (Sorry about that, but we can’t show files that are this big right now.)
        
    
## index.html

      
    Raw
  

              index.html
            
          
            View raw
              (Sorry about that, but we can’t show files that are this big right now.)
        
    
## LICENSE

      
    Raw
  

              LICENSE
            
          
            View raw
              (Sorry about that, but we can’t show files that are this big right now.)
        
    
## OrbitControls.js

      
    Raw
  

              OrbitControls.js
            
          
            View raw
              (Sorry about that, but we can’t show files that are this big right now.)
        
    
## Qgis2threejs.css

      
    Raw
  

              Qgis2threejs.css
            
          
            View raw
              (Sorry about that, but we can’t show files that are this big right now.)
        
    
## Qgis2threejs.js

      
    Raw
  

              Qgis2threejs.js
            
          
            View raw
              (Sorry about that, but we can’t show files that are this big right now.)
        
    
## three.min.js

      
    Raw
  

              three.min.js
            
          
            View raw
              (Sorry about that, but we can’t show files that are this big right now.)
        
    
## threejs-LICENSE

      
    Raw
  

              threejs-LICENSE
            
          
            View raw
              (Sorry about that, but we can’t show files that are this big right now.)
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title>3Dsample</title>
	<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
	<link rel="stylesheet" type="text/css" href="./Qgis2threejs.css">
	</head>
	<body>
	<div id="webgl"></div>

	<!-- popup -->
	<div id="popup" style="display:none;">
	<div id="closebtn">×</div>
	<div id="popupbar"></div>
	<div id="popupbody">
	<div id="popupcontent"></div>
	<div id="pageinfo">
	<h1>Current View URL</h1>
	<div><input id="urlbox" type="text"></div>

	<h1>Usage</h1>
	<div id="usage"></div>

	<h1>About</h1>
	<div id="about">This page was made with <a href="http://www.qgis.org/" target="_blank">QGIS</a> and <a href="https://github.com/minorua/Qgis2threejs" target="_blank">Qgis2threejs</a> plugin,
	and uses the following library:
	<ul>
	<li>three.js <a href="http://threejs.org/" target="_blank">http://threejs.org/</a> <a href="./threejs-LICENSE" target="_blank" class="license">(LICENSE)</a></li>
	<li>dat-gui <a href="https://code.google.com/p/dat-gui/" target="_blank">https://code.google.com/p/dat-gui/</a> <a href="./dat-gui-license.txt" target="_blank" class="license">(LICENSE)</a></li>
	<li id="lib_proj4js" style="display: none;">Proj4js <a href="http://trac.osgeo.org/proj4js/" target="_blank">http://trac.osgeo.org/proj4js/</a> <a href="./proj4js/LICENSE.md" target="_blank" class="license">(LICENSE)</a></li>
	</ul>
	</div>
	</div>
	</div></div>

	<!-- footer -->
	<div id="footer"></div>

	<script src="./three.min.js"></script>
	<script src="./Qgis2threejs.js"></script>
	<script src="./OrbitControls.js"></script>
	<script>
	var option = Q3D.Options;

	</script>
	<script src="./3Dsample.js"></script>
	<script>
	if (typeof proj4 !== "undefined") document.getElementById("lib_proj4js").style.display = "list-item";

	var container = document.getElementById("webgl");
	// initialize application
	var app = Q3D.application;
	app.init(container);

	// load the project
	app.loadProject(project);

	app.addEventListeners();
	app.start();

	</script>
	<script src="./dat.gui.min.js"></script>
	<script src="./dat-gui_panel.js"></script>
	<script>
	// initialize dat-gui panel
	Q3D.gui.init();
	</script>
	</body>
	</html>
	// Qgis2threejs Project
	project = new Q3D.Project({crs:"EPSG:3826",wgs84Center:{lat:25.1515798915,lon:121.544788602},proj:"+proj=tmerc +lat_0=0 +lon_0=121 +k=0.9999 +x_0=250000 +y_0=0 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs",title:"3Dsample",baseExtent:[303194.902822,2781722.6881,306652.763633,2783633.26973],rotation:0,zShift:0.0,width:100.0,zExaggeration:1.5});

	// Layer 0
	lyr = project.addLayer(new Q3D.DEMLayer({q:1,shading:true,type:"dem",name:"twdtm_asterv2_30m-tm2_twd97"}));
	bl = lyr.addBlock({width:673,plane:{width:100.0,offsetX:0,offsetY:0,height:55.2532833021},m:0,sides:true,height:372}, false);