샘플 리스트
<!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; } #cmworld3Canvas { width: 100%; height: 100%; } #labelDiv { font-size: 12px; color: #ffd800; position: absolute; top: 20px; left: 10px; z-index: 1; } </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> var cmworld; var gui; var canvasLeft; var canvasTop; var font = null; var clock = new THREE.Clock(true); var tick = 0; var posGeo = new THREE.Vector3(0, 0, 5000000); var mesh = null; example = function (event) { cmworld.option.worldTimer.reset(); cmworld.option.worldTimer.setSpeed(6000); cmworld.option.worldTimer.setStartDateTime(2015, 7, 12, 14, 0, 0, 0); cmworld.option.worldTimer.start(); for (var i = 0; i < 24; i++) { var date = new Date(2015, 7, 12, i, 0, 0, 0); var sunpos = CMWORLD.SunCalculator.getPosition(cmworld.option.worldTimer.now()); //var pos = CMWORLD.SunCalculator.CalculateSunPosition(date, 38, 127); //var pos2 = CMWORLD.SunCalculator.CalculateSunPosition2(date, 38, 127); //console.log(i + " : " + pos.Azimuth + ", " + pos2.Azimuth + " " + pos.Altitude + ", " + pos2.Altitude); } // 원하는 위치로 이동. //cmworld.gotoGeo(127, 37.5, 10000 ); var userLayer = new CMWORLD.UserObjectLayer("test"); cmworld.addLayer(userLayer); mesh = new THREE.Mesh(new THREE.BoxGeometry(20, 20, 20), new THREE.MeshPhongMaterial({ color: 0xf08000, side: THREE.DoubleSide })); var origin = CMWORLD.CmMathEngine.Geo2Cartesian(posGeo.x, posGeo.y, CMWORLD.cm_const.EarthRadius + posGeo.z); mesh.position.set(origin.x, origin.y, origin.z); mesh.scale.set(10000, 10000, 10000); var cmObj1 = new CMWORLD.UserObject("space object", mesh, posGeo, onAnimation); userLayer.add(cmObj1); } onAnimation = function() { var sunpos = CMWORLD.SunCalculator.getPosition(cmworld.option.worldTimer.now(), 38, 127); sunpos.setLength(CMWORLD.cm_const.EarthRadius * 2); sunpos.sub(cmworld.option.refCenter); mesh.position.set(sunpos.x, sunpos.y, sunpos.z); /* posGeo.x += 1; if (posGeo.x > 360) posGeo.x = 0; var origin = CMWORLD.CmMathEngine.Geo2Cartesian(posGeo.x, posGeo.y, CMWORLD.cm_const.EarthRadius + posGeo.z); mesh.position.set(origin.x, origin.y, origin.z); */ } window.onload = function () { var canvas = document.querySelector("#cmworld3Canvas"); // canvas 지정, 시작 위치 지정 cmworld = new CMWORLD.CmWorld3(canvas, 0, 0, CMWORLD.cm_const.EarthRadius * 5 ); // 영상 및 지형 레이어 추가. cmworld.addTileImageLayer("base", "http://cmworld.net:5050/CmWorld/CmWorldServlet?T=world_raster&L={z}&X={x}&Y={y}", 0, 12, 90, -90, -180, 180, "jpg", false); cmworld.addTerrainLayer("terrain", "http://cmworld.net:5050/CmWorld/CmWorldServlet?T=dem30m&L={z}&X={x}&Y={y}", 0, 12, 90, -90, -180, 180, "CBT"); cmworld.showLatLonLine(false); example(); }; </script> </head> <body> <canvas id="cmworld3Canvas"></canvas> <div id="labelDiv"> * space layer 컨트롤<br> </div> </body> </html>