<!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>
var cmworld;
var gui;
var colorindex = 0;
var userLayer;
onupdateobject = function () {
}
onupdateobject2 = function (userObject, deltatime) {
try {
if (userObject.object.material.map.image.tagName == 'VIDEO') { //비디오 계속 재생
if (userObject.object.material.map.image.ended)
userObject.object.material.map.image.play();
}
}
catch (e) {
console.log(e);
}
}
example = function () {
var obj = CMWORLD.UserObject.createBillboard("박신혜", 127.0824908270686, 37.51431590891756, 53.019603750668466, 50, 40, './textures/a.jpg', onupdateobject);
userLayer.add(obj);
}
var video;
function addMovie(div) {
cmworld.gotoLookAt(127.0780777930928, 37.51701353543044, 200, 127.08295146627665, 37.516783911048485, 0);
if (userLayer.userObjects.length < 2) {
//동영상
video = document.createElement('video');
video.src =
//'./model/cmworld.webm'; //회사 소개
//'http://localhost:8080/model/cmworld.webm'; //회사 소개
'http://demo.cmworld.net/ws/static/model/cmworld.webm';
//'https://www.utic.go.kr:449/view/map/cctvStream.jsp?cctvid=L010060&cctvname=%25EC%258B%259C%25ED%259D%25A5IC&kind=Seoul&cctvip=43&cctvch=51&id=50&cctvpasswd=null&cctvport=null&minX=126.86998185417964&minY=37.46641583954065&maxX=126.93164147955191&maxY=37.50222804142923';
//'http://cctvsec.ktict.co.kr/3594/cZm8jLK7rMfpGQLCa86Bcxzpdo0jWzMWEXB6PcKdMSm71oqL5ZgBw3cIg0fi0rq4'; //'./model/cmworld.webm'; //회사 소개
video.type="video/webm";
video.play();
var obj2 = CMWORLD.UserObject.createBillboardwithTexture("동영상", 127.08217920137088, 37.51775969047421, 60, 120, 80, video, onupdateobject2);
userLayer.add(obj2);
}
viewControls(div);
}
function viewControls(div)
{
if (!div) return;
if (!video) return;
if ($(div).text() == '동영상보이기') {
$(div).text('동영상숨기기');
video.play();
if (userLayer.userObjects.length > 1) {
userLayer.userObjects[1].visible = true;
}
}
else {
$(div).text('동영상보이기');
video.pause();
if (userLayer.userObjects.length > 1) {
userLayer.userObjects[1].visible = false;
}
}
}
window.onload = function () {
var canvas = document.querySelector("#cmworldCanvas");
cmworld = new CMWORLD.CmWorld3(canvas, 127, 38, 5000, { toptilespan: 36 });
cmworld.option.worldTimer.setStartDateTime(2015, 7, 12, 14, 0, 0, 0);
cmworld.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);
cmworld.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, "");
cmworld.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");
//cmworld.addVectorImageLayer("dangjin_poitest", "http://cmworld.net:5050/CmWorld/CmWorldServlet", "http://www.cmworld.net:5050/CmWorld/ResourceManagerServlet", "dangjin_vwpoitest", 12, [5], 90, -90, -180, 180, "cmv");
cmworld.option.showFPS(true);
userLayer = new CMWORLD.UserObjectLayer("lines");
cmworld.addLayer(userLayer);
example();
var eye_x = 127.08174188396235;
var eye_y = 37.51231017799103;
var eye_h = 200;
var look_x = 127.08174188396235;
var look_y = 37.51505310508758;
var look_h = 10;
cmworld.gotoLookAt(eye_x, eye_y, eye_h, look_x, look_y, look_h);
};
</script>
</head>
<body>
<canvas id="cmworldCanvas"></canvas>
<a href="#" onclick="addMovie(this);" style="font-size:20px;left: 10px; top: 10px; position: absolute; z-index: 10000;color: rgb(182, 255, 0)">동영상보이기</a>
</body>
</html>