<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>CmWorld3 Sample</title>
<style>
html, body {
overflow: hidden;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
#cmworldCanvas {
width: 100%;
height: 100%;
}
</style>
<script src="./Cm3WebGL/lib/jquery-2.2.0.min.js"></script>
<script src="./Cm3WebGL/cm_compile.js"></script>
<script> CMWORLD.Compile.includeCm3Library("./Cm3WebGL/") </script>
<script src="./Cm3WebGL/SpecitialEffect/ParallaxBarrierEffect.js"></script>
<script>
var cmworldViewer;
var effect_ParallexBarrier = null;
window.onload = function ()
{
var canvas = document.querySelector("#cmworldCanvas");
var siteRoot = CMWORLD.Compile.getSiteRootUrl();
cmworldViewer = new CMWORLD.CmWorld3(canvas, 127, 38, CMWORLD.cm_const.EarthRadius, { toptilespan: 36 });
cmworldViewer.option.worldTimer.setStartDateTime(2015, 7, 12, 14, 0, 0, 0);
//gliEmbedDebug = true;
/*
cmworldViewer.addTileImageLayer("base", "http://cmworld.net:5050/CmWorld/CmWorldServlet?T=world_raster&L={z}&X={x}&Y={y}", 0, 12, 90, -90, -180, 180, "png", false);
cmworldViewer.addTerrainLayer("terrain", "http://cmworld.net:5050/CmWorld/CmWorldServlet?T=dem30m&L={z}&X={x}&Y={y}", 0, 12, 90, -90, -180, 180, "CBT");
cmworldViewer.addVectorLayer("yangsan_pic_building", "http://cmworld.net:5050/CmWorld/CmWorldServlet", "http://www.cmworld.net:5050/CmWorld/ResourceManagerServlet", "yangsan_pic_building", 12, 19, 90, -90, -180, 180, "cmv");
*/
cmworldViewer.addTileImageLayer("base", "http://xdworld.vworld.kr:8080/XDServer3d/requestLayerNode?APIKey=B470EFE5-A211-35EE-A38A-0D5AD519F236&Layer=tile&Level={z}&IDX={x}&IDY={y}", 0, 15, 90, -90, -180, 180, "jpg", false);
cmworldViewer.addTerrainLayer("terrain", "http://xdworld.vworld.kr:8080/XDServer3d/requestLayerNode?APIKey=B470EFE5-A211-35EE-A38A-0D5AD519F236&Layer=dem&Level={z}&IDX={x}&IDY={y}", 0, 15, 90, -90, -180, 180, "");
cmworldViewer.addReal3DLayer("facility_build", "http://xdworld.vworld.kr:8080/XDServer3d/requestLayerNode?Layer=facility_build&Level={z}&IDX={x}&IDY={y}&APIKey=B470EFE5-A211-35EE-A38A-0D5AD519F236",
"http://xdworld.vworld.kr:8080/XDServer3d/requestLayerObject?APIKey=B470EFE5-A211-35EE-A38A-0D5AD519F236&Layer=facility_build&Level={z}&IDX={x}&IDY={y}&DataFile={f}", "facility_build", 0, 15, 90, -90, -180, 180, "dat");
cmworldViewer.addReal3DLayer("facility_build_at", "http://xdworld.vworld.kr:8080/XDServer3d/requestLayerNode?Layer=facility_build_at&Level={z}&IDX={x}&IDY={y}&APIKey=B470EFE5-A211-35EE-A38A-0D5AD519F236",
"http://xdworld.vworld.kr:8080/XDServer3d/requestLayerObject?APIKey=B470EFE5-A211-35EE-A38A-0D5AD519F236&Layer=facility_build_at&Level={z}&IDX={x}&IDY={y}&DataFile={f}", "facility_build_at", 0, 15, 90, -90, -180, 180, "dat");
cmworldViewer.addReal3DLayer("facility_bridge", "http://xdworld.vworld.kr:8080/XDServer3d/requestLayerNode?Layer=facility_bridge&Level={z}&IDX={x}&IDY={y}&APIKey=B470EFE5-A211-35EE-A38A-0D5AD519F236",
"http://xdworld.vworld.kr:8080/XDServer3d/requestLayerObject?APIKey=B470EFE5-A211-35EE-A38A-0D5AD519F236&Layer=facility_bridge&Level={z}&IDX={x}&IDY={y}&DataFile={f}", "facility_bridge", 0, 14, 90, -90, -180, 180, "dat");
/*
cmworldViewer.addVWPOILayer("poi_base", "http://xdworld.vworld.kr:8080/XDServer/requestLayerNode?Layer=poi_base&Level={z}&IDX={x}&IDY={y}&APIKey=767B7ADF-10BA-3D86-AB7E-02816B5B92E9",
"http://xdworld.vworld.kr:8080/XDServer/requestLayerObject?APIKey=767B7ADF-10BA-3D86-AB7E-02816B5B92E9&Layer=poi_base&Level={z}&IDX={x}&IDY={y}&DataFile={f}", "poi_base", 0, 15, 90, -90, -180, 180, "poi");
*/
if (CMWORLD.Compile.DistributionMode == false)
{
cmworldViewer.option.showFPS(true);
}
cmworldViewer.setAnaglyphMode();
};
function anaglyph()
{
effect_ParallexBarrier = null;
var mode = cmworldViewer.isAnaglyphMode();
cmworldViewer.setAnaglyphMode();
}
function parallexBarrier() {
cmworldViewer.setAnaglyphMode(false);
/*
var renderer = cmworldViewer.getRenderer();
var size = renderer.getSize();
effect_ParallexBarrier = new THREE.ParallaxBarrierEffect(renderer);
effect_ParallexBarrier.setSize(size.width, size.height);
effect_ParallexBarrier.render(cmworldViewer.rootScene, cmworldViewer.getCamera().getThreejsCamera());*/
}
</script>
</head>
<body>
<canvas id="cmworldCanvas"></canvas>
<a href="#" onclick="anaglyph()" style="right: 10px; top: 20px; position: absolute; z-index: 10000;color: rgb(182, 255, 0)">anaglyph</a>
<a href="#" onclick="parallexBarrier()" style="right: 10px; top: 40px; position: absolute; z-index: 10000;color: rgb(182, 255, 0)">parallexBarrier</a>
</body>
</html>