<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>CmWorld3 Sample</title>
<style>
html, body {
font-family: 'Comic Sans MS';
overflow: hidden;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
#cmworldCanvas {
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 src="./sample/js/GPUParticleSystem.js" charset="utf-8"></script>
<script src="./sample/js/CSS3DRenderer.js" charset="utf-8"></script>
<script src="./sample/js/stats.min.js" charset="utf-8"></script>
<script src="./Cm3WebGL/Loader/OBJMTLLoader.js"></script>
<script>
var cmworldViewer;
var bEnablePointCloud = true;
var droneLayerName = "cubeGroup";
var droneAroundMesh;
var dronePath = null;
var showDronePathCubeFlag = false;
var pathCubeArray = [];
var showCubeAroundDroneFlag = false;
var aroundCubes = [];
/*사용자 레이어를 얻자.*/
getUserLayer = function () {
var layerName = "testLayer";
var layer = cmworldViewer.getLayer(layerName);
if (layer) {
return layer;
}
// 없으면 만들어서 추가한다.
var userLayer = new CMWORLD.UserObjectLayer(layerName);
cmworldViewer.addLayer(userLayer);
return userLayer;
}
function showDronePathCube( visible )
{
showDronePathCubeFlag = visible;
for (var key in pathCubeArray) {
pathCubeArray[key].visible = visible;
}
}
function clearPathCube() {
// 기존에 있는것 초기화.
for (var key in pathCubeArray) {
getUserLayer().remove(pathCubeArray[key]);
}
pathCubeArray = [];
preCubeIndex = new THREE.Vector3(-1, -1, -1);
}
function setDronePath(koreaGeoPts) {
if (koreaGeoPts == null || koreaGeoPts.length < 1)
{
return;
}
clearPathCube();
var worldObject = CMWORLD.UserObject.createWorldObject("드론경로", koreaGeoPts, true);
var userLayer = getUserLayer();
userLayer.add(worldObject);
worldObject.setColor(new THREE.Color(0x00fff0));
worldObject.getMesh().material.linewidth = 10;
var koreaCartaPts = [];
for (var key in koreaGeoPts) {
var pos = koreaGeoPts[key];
koreaCartaPts.push(CMWORLD.CmMathEngine.Geo2Cartesian(pos.x, pos.y, CMWORLD.cm_const.EarthRadius + pos.z));
}
dronePath = new THREE.SplineCurve3(koreaGeoPts);
dronePath.koreaCartaPts = koreaCartaPts;
displayCubeAroundPath(dronePath);
}
function initDronePath() {
var userLayer = getUserLayer();
userLayer.clear();
var siteRootFolder = CMWORLD.Compile.getSiteRootUrl();
//var urlPathData = siteRootFolder + "/resource/Drone_Trace_Point_02.csv";
var urlPathData = siteRootFolder + "/resource/Drone_Trace_Point_01.csv";
//var urlPathData = siteRootFolder + "/resource/test.csv";
CMWORLD.NetWork.requestFile(urlPathData, function (params) {
if (params.response) {
var responseText = params.response;
var lineStringList = responseText.split(/\s+/);
var koreaGeoPts = [];
// 첫번째 줄은 Header
var startRow = 1;
for (i = startRow; i < lineStringList.length; i++) {
var cells = lineStringList[i].split(",");
// 정상적으로 읽어졌는지 확인 필요.
if (cells.length > 3) {
var lon = parseFloat(cells[2]);
var lat = parseFloat(cells[3]);
var height = parseFloat(cells[4]);
koreaGeoPts.push(new THREE.Vector3(lon, lat, height));
}
}
// 데이터가 성공적이면.
if (koreaGeoPts.length > 0) {
cmworldViewer.gotoGeo(koreaGeoPts[0].x, koreaGeoPts[0].y, 500);
setDronePath(koreaGeoPts);
}
}
}, null, false, "text");
}
function displayCubeAroundPathLoop()
{
displayCubeAroundPath(dronePath);
}
function displayCubeAroundPathLoopEnd()
{
droneFlyDistance = 0;
preCubeIndex = new THREE.Vector3(-1, -1, -1);
}
var preCubeIndex = new THREE.Vector3(-1, -1, -1);
function displayCubeAroundPath( dronePath )
{
var layer = cmworldViewer.getLayer(droneLayerName);
if (layer == null)
{
return;
}
var cartePos;
var result = CMWORLD.CmMathEngine.getPosInPolyLine(dronePath.koreaCartaPts, droneFlyDistance);
if (result.success == false || result.over == true) {
displayCubeAroundPathLoopEnd();
return;
}
var pos = CMWORLD.CmMathEngine.Cartesian2Geo(result.pos.x, result.pos.y, result.pos.z);
pos.z -= CMWORLD.cm_const.EarthRadius;
var longitude = pos.x;
var latitude = pos.y;
var altitude = pos.z;
var cubeTileIndex = layer.getCubeTileIndexByCoord(longitude, latitude, altitude);
var cubeTileUrl = layer.getServerUrl(cubeTileIndex.level, cubeTileIndex.row, cubeTileIndex.col);
// 격자파일을 요청한다.
CMWORLD.CubeGroupLoader.requestCubeFile(cubeTileUrl,
function (params) {
if (params.success) {
var readResult = CMWORLD.CubeGroup.readData(params.arraybuffer);
var leftTop = new THREE.Vector3;
var rightBottm = new THREE.Vector3;
CMWORLD.CmMathEngine.GetTileGeoBoundary(cubeTileIndex.level, cubeTileIndex.row, cubeTileIndex.col, leftTop, rightBottm);
var cubeGroup = new CMWORLD.CubeGroup(null, null, null);
cubeGroup.setCubeData(readResult.cubeValueBuffer);
cubeGroup.setDataInfo(readResult.cubeSize, readResult.cubeBlockHeight, 0,
leftTop.x, rightBottm.x, rightBottm.y, leftTop.y);
var cubeIndex = cubeGroup.getCubeIndexbyCoord(longitude, latitude, altitude);
var keyName = cubeIndex.z.toString() + "_" + cubeIndex.y.toString() + "_" + cubeIndex.x.toString() + "" + (cubeIndex.z + cubeIndex.y + cubeIndex.z).toString();
if (preCubeIndex)
// 바로 이전 격자와 동일하면 안만들도록.
if (preCubeIndex.x != cubeIndex.x || preCubeIndex.y != cubeIndex.y || preCubeIndex.y != cubeIndex.y) {
var cubeValue = cubeGroup.getValue(cubeIndex.z, cubeIndex.y, cubeIndex.x);
var cubeCoord = cubeGroup.getCubeCenterCoordinatebyIndex(cubeIndex.z, cubeIndex.y, cubeIndex.x);
var color = getValueColor(cubeValue);
var mesh = createCubeMesh(color);
var userObj = new CMWORLD.UserObject("test22", mesh, new THREE.Vector3(0, 0, 0), null);
getUserLayer().add(userObj);
userObj.setPosition(cubeCoord.x, cubeCoord.y, cubeCoord.z);
userObj.rotate4GlobeEarth();
userObj.visible = showDronePathCubeFlag;
pathCubeArray.push(userObj);
}
preCubeIndex = cubeIndex;
}
droneFlyDistance += 3;
requestAnimationFrame(displayCubeAroundPathLoop);
});
}
function getValueColor(cubeValue)
{
var color = 0x0000ff;
if (cubeValue > 0) {
if (cubeValue > 200) {
color = 0x00ff00;
}
else {
color = 0xff0000;
}
}
return color;
}
/*드론을 날려볼까?*/
function flyDrone() {
if (dronePath == null)
{
alert("드론 경로를 먼저 설정하세요!");
return;
}
droneFlyIndex = 0;
var userLayer = getUserLayer();
var loader = new THREE.OBJMTLLoader();
loader.load("./model/Drone-MQ27/MQ-27.obj", "./model/Drone-MQ27/MQ-27.mtl", function (obj) {
// 경로의 시작 좌표를 넣어줘야 한다.
var droneobj = new CMWORLD.UserObject("drone", obj, new THREE.Vector3(127.1407074, 34.89050, 22.494735240004957), onUpdatedronePosition);
droneobj.rotate4GlobeEarth();
droneobj.setRotateAll(90, 90, 0);
var scale = 0.02;
droneobj.setScale(scale, scale, scale);
userLayer.add(droneobj);
});
}
function showCubeAroundDrone(visible) {
showCubeAroundDroneFlag = visible;
for( var key in aroundCubes )
{
aroundCubes[key].visible = visible
}
}
function createCubeMesh( meshColor ) {
var cubeGroupImageURL = "textures/whitebox.png";
var cubeTexture = new THREE.TextureLoader().load(cubeGroupImageURL);
// 나중에 위도에 맞는 크기를 계산해서 넣어줘야 한다.
var rollOverGeo = new THREE.BoxGeometry(4.55, 5.45, 5);
//var material = new THREE.MeshBasicMaterial({ color: 0x0000ff, opacity: 0.3, transparent: true });
var cubeMaterial = new THREE.MeshLambertMaterial({ color: meshColor, map: cubeTexture, opacity: 0.3, transparent: true });
var aroundMesh = new THREE.Mesh(rollOverGeo, cubeMaterial);
return aroundMesh;
}
function displayCubeAroundDrone( longitude, latitude, altitude )
{
// 드론 주변의 격자를 얻어서 표현한다.
{
var layer = cmworldViewer.getLayer(droneLayerName);
if (layer != null) {
var cubeTileIndex = layer.getCubeTileIndexByCoord(longitude, latitude, altitude);
var cubeTileUrl = layer.getServerUrl(cubeTileIndex.level, cubeTileIndex.row, cubeTileIndex.col);
// 격자파일을 요청한다.
CMWORLD.CubeGroupLoader.requestCubeFile(cubeTileUrl,
function (params) {
if (params.success) {
var readResult = CMWORLD.CubeGroup.readData(params.arraybuffer);
var leftTop = new THREE.Vector3;
var rightBottm = new THREE.Vector3;
CMWORLD.CmMathEngine.GetTileGeoBoundary(cubeTileIndex.level, cubeTileIndex.row, cubeTileIndex.col, leftTop, rightBottm);
var cubeGroup = new CMWORLD.CubeGroup(null, null, null);
cubeGroup.setCubeData(readResult.cubeValueBuffer);
cubeGroup.setDataInfo(readResult.cubeSize, readResult.cubeBlockHeight, 0,
leftTop.x, rightBottm.x, rightBottm.y, leftTop.y);
var cubeIndex = cubeGroup.getCubeIndexbyCoord(longitude, latitude, altitude);
// 주변에 큐브를 만든다.
{
while (aroundCubes.length < 28) {
var aroundMesh = createCubeMesh(0x0000ff);
var userObj = new CMWORLD.UserObject("test11", aroundMesh, new THREE.Vector3(0, 0, 0), null);
getUserLayer().add(userObj);
aroundCubes.push(userObj);
}
}
// 주변 27개에 대해서 그려보자.
var meshIndex = 0;
for (var z = cubeIndex.z - 1; z < cubeIndex.z + 2; z++) {
for (var y = cubeIndex.y - 1; y < cubeIndex.y + 2; y++) {
for (var x = cubeIndex.x - 1; x < cubeIndex.x + 2; x++) {
var cubeValue = cubeGroup.getCubeValuebyIndex(z, y, x);
var color = getValueColor(cubeValue);
var cubeCoord = cubeGroup.getCubeCenterCoordinatebyIndex(z, y, x);
var aCubeObject = aroundCubes[meshIndex];
var threejMesh = aCubeObject.getMesh();
threejMesh.material.color = new THREE.Color(color);
aCubeObject.setPosition(cubeCoord.x, cubeCoord.y, cubeCoord.z);
aCubeObject.rotate4GlobeEarth();
aCubeObject.visible = showCubeAroundDroneFlag;
++meshIndex;
}
}
}
showCubeAroundDrone(showCubeAroundDroneFlag);
}
});
}
}
}
var droneFlyIndex = 0;
var droneFlyDistance = 0;
var droneIsFly = false;
var droneCameraRotate = 0;
function onUpdatedronePosition(userObject, deltatime) {
if (dronePath == null)
return;
// 설정된 패스를 가져와서.
var pos = dronePath.getPoint(droneFlyIndex);
var tan = dronePath.getTangent(droneFlyIndex).normalize();
userObject.setPosition(pos.x, pos.y, pos.z);
displayCubeAroundDrone(pos.x, pos.y, pos.z);
var upDir = new THREE.Vector3(0, 1, 0);
var axis = new THREE.Vector3();
axis.crossVectors(upDir, tan).normalize();
radians = Math.acos(upDir.dot(tan));
// set the quaternion
userObject.rotate4GlobeEarth(CMWORLD.RotateOp.Reset);
userObject.setRotate(90);
//userObject.setFromAxisAngle(axis, radians, CMWORLD.RotateOp.Reset);
//userObject.rotate4GlobeEarth();
//userObject.rotate(90, 0, 0);
if (droneIsFly == true) {
// 카메라 위치를 지정해 보자
var ct = droneFlyIndex - 0.05;
if (ct < 0) {
// 현재 droneFlyIndex만큼 1에서 뺀 값을 가지고 구한다.
ct = 1.0 + ct;
}
{
var cameraPos = dronePath.getPoint(ct);
var camera = cmworldViewer.getCamera();
// 바라보는 지점에서 일정거리에서 그냥 보면 된다.
var distance = 500;
// 효과를 주기 위해서 조금씩 돌자.
var shift = distance / 100000;
droneCameraRotate += 0.005;
if (droneCameraRotate > Math.PI * 2) {
droneCameraRotate = 0;
}
//var rotation = new THREE.Matrix4().makeRotationZ(droneCameraRotate / 2);
var tempPos = new THREE.Vector3(shift, shift, 0);
var axis = new THREE.Vector3(0, 0, 1);
var angle = droneCameraRotate;
tempPos.applyAxisAngle(axis, angle);
cmworldViewer.gotoLookAt(pos.x + tempPos.x, pos.y + tempPos.y, pos.z + distance, pos.x, pos.y, pos.z);
//cmworldViewer.gotoLookAt(pos.x, pos.y, pos.z, cameraPos.x, cameraPos.y, cameraPos.z + 100);
// pos를 Geo로 바꾸자
//camera.setPositionGeo(lookPos.x, lookPos.y, lookPos.z);
//camera.setLookPositionGeo(pos.x, pos.y, pos.z);
}
}
droneFlyIndex += 0.001;
if (droneFlyIndex > 1) {
droneFlyIndex = 0;
}
}
function setDroneFlyMode() {
if (droneIsFly) {
droneIsFly = false;
}
else {
droneIsFly = true;
}
}
// tempporary function (have to remove after modularity)
loadNRenderCSVFile = function (pointsDataArr) {
var xmlHttpRequest = new XMLHttpRequest;
var url = 'resource/Point_Cloud_Area_Data_WGS84_LL.csv';
var fileRows;
var cells4Row;
var fileRowsLen;
var cellCol0, cellCol1, cellCol2;
var vec3Pos;
var i;
xmlHttpRequest.onreadystatechange = function () {
if (xmlHttpRequest.readyState == CMWORLD.xHttp_readyState.finished &&
xmlHttpRequest.status == CMWORLD.HttpStatusCode.OK) {
fileRows = xmlHttpRequest.responseText.split(/\s+/);
fileRowsLen = fileRows.length;
var a = fileRows[0];
var b = fileRows[1];
var c = fileRows[2];
var maxHeight = -999999;
var minHeight = 999999;
for (i = 1; i < fileRowsLen; ++i) {
cells4Row = fileRows[i].split(",");
cellCol0 = parseFloat(cells4Row[0]);
cellCol1 = parseFloat(cells4Row[1]);
cellCol2 = parseFloat(cells4Row[2]) + CMWORLD.cm_const.EarthRadius;
var tempHeight = parseFloat(cells4Row[2]);
if (maxHeight < tempHeight) {
maxHeight = tempHeight;
}
if (minHeight > tempHeight) {
minHeight = tempHeight;
}
vec3Pos = CMWORLD.CmMathEngine.Geo2Cartesian(cellCol0, cellCol1, cellCol2);
// 원래 높이를 기록해두자.
vec3Pos.w = parseFloat(cells4Row[2]);
pointsDataArr.push(vec3Pos);
}
renderCSVFile(pointsDataArr, minHeight, maxHeight);
}
}
xmlHttpRequest.open('GET', url, true);
xmlHttpRequest.send(null);
}
// tempporary function (have to remove after modularity)
renderCSVFile = function (pointsDataArr, minH, maxH ) {
var geometry = new THREE.BufferGeometry();
var material;
var points;
var pointsDataLen = pointsDataArr.length;
var pointTexture;
var pointsTrans = new THREE.Vector3;
var terrainScene = cmworldViewer.getTerrainScene();
var i;
var numTest = pointsDataLen;
var offsetTest = 0;
var positions = new Float32Array(numTest * 3);
var colors = new Float32Array(numTest * 3);
var colorRange = maxH - minH;
var bottomH = minH;// + (colorRange*0.2);
for (i = 0; i < pointsDataLen; ++i) {
positions[3 * (i - offsetTest) + 0] = pointsDataArr[i].x;
positions[3 * (i - offsetTest) + 1] = pointsDataArr[i].y;
positions[3 * (i - offsetTest) + 2] = pointsDataArr[i].z;
var colorG = (pointsDataArr[i].w - bottomH) / colorRange;
colorG *= 2;
if (colorG < 0) {
colorG = 0;
}
else if (colorG > 2) {
colorG = 2;
}
colors[3 * (i - offsetTest) + 0] = 1 - colorG;
colors[3 * (i - offsetTest) + 1] = 0;
if (colorG > 1){
colorG = 1;
}
colors[3 * (i - offsetTest) + 2] = colorG;
// console.log(i + 'x: ' + pointsDataArr[i].x, 'y: ' + pointsDataArr[i].y, 'z: ' + pointsDataArr[i].z);
}
geometry.addAttribute('position', new THREE.BufferAttribute(positions, 3));
geometry.addAttribute('color', new THREE.BufferAttribute(colors, 3));
pointTexture = new THREE.TextureLoader().load("textures/disc.png");
material = new THREE.PointsMaterial({
size: 1,
sizeAttenuation: true,
map: pointTexture,
vertexColors: THREE.VertexColors,
alphaTest: 0.5,
transparent: true
});
var objectName = "cloudPoints";
points = new THREE.Points(geometry, material);
var obj1 = new CMWORLD.UserObject(objectName, points);
var userLayer = getUserLayer();
userLayer.add(obj1);
}
function showPointCloud() {
bEnablePointCloud = !bEnablePointCloud;
var objectName = "cloudPoints";
var userLayer = getUserLayer();
var obj = userLayer.getObject(objectName);
obj.visible = bEnablePointCloud;
// 해당 위치로 이동.
if (bEnablePointCloud) {
cmworldViewer.gotoGeo(127.133, 34.893, 200);
}
}
enableRenderDepthType = function () {
cmworldViewer.enableCubeGroupRenderDepthType();
}
enableRenderObjectType = function () {
cmworldViewer.enableCubeGroupRenderObjectType();
}
droneGilExam = function () {
var pointsDataArr = new Array;
// 10-6394-15725
gotoJunju();
loadNRenderCSVFile(pointsDataArr);
//loadDemo3DS();
//colladaExam();
}
function loadDemo3DS() {
var userLayer = getUserLayer();
var siteRootFolder = CMWORLD.Compile.getSiteRootUrl();
var modelresoucrFolder = "/model/drone2016/";
var modelName = "virtualbuilding.3ds";
CMWORLD.CmWorld3.load3DS(siteRootFolder + modelresoucrFolder + modelName, siteRootFolder + modelresoucrFolder,
function (name, url, meshArray) {
for (var i in meshArray) {
var mesh = meshArray[i];
// texture가 있을 경우, 생성.
var imageName = mesh.material.imageName;
fileurl = siteRootFolder + modelresoucrFolder + imageName;
var tex = CMWORLD.CmWorld3.loadTexture(fileurl);
tex.minFilter = THREE.LinearFilter;
tex.needUpdate = true;
tex.imageName = imageName;
var mat = new THREE.MeshPhongMaterial({ color: 0x999999 })
//var mat = new THREE.MeshPhongMaterial({ map: tex, specular: 0, shininess: 0 });
mat.needsUpdate = true;
//mat.side = THREE.DoubleSide;
mesh.material = mat;
mesh.scale.set(1, 1, 1);
var userObj = new CMWORLD.UserObject(name, mesh, new THREE.Vector3(127.101605230, 35.766255974, 0), null);
userObj.rotate4GlobeEarth();
userLayer.add(userObj);
}
});
}
var dae;
// collada 모델을 읽어보자.
function colladaExam() {
var userLayer = getUserLayer();
var siteRootFolder = CMWORLD.Compile.getSiteRootUrl();
var loader = new THREE.ColladaLoader();
loader.options.convertUpAxis = true;
loader.load('model/collada/avatar.dae', function (collada) {
dae = collada.scene;
dae.traverse(function (child) {
if (child instanceof THREE.SkinnedMesh) {
//var animation = new THREE.Animation(child, child.geometry.animation);
//animation.play();
}
});
dae.scale.x = dae.scale.y = dae.scale.z = 100;
dae.updateMatrix();
var height = 200;
var obj1 = new CMWORLD.UserObject("collada", dae, new THREE.Vector3(127.146335364864, 34.8951481968142, 100) );
obj1.rotate4GlobeEarth();
userLayer.add(obj1);
});
}
function gotoDemo1() {
cmworldViewer.gotoGeo(127.133, 34.893, 1000);
}
function gotoJunju() {
cmworldViewer.gotoGeo(127.10919665873598, 35.77268061841959, 900);
}
function gotoYeongwol() {
cmworldViewer.gotoGeo(128.46292295315243, 37.176945738131366, 500);
}
function setTileInfo() {
cmworldViewer.option.viewTileInfo = !cmworldViewer.option.viewTileInfo;
}
function showCube() {
var layer = cmworldViewer.getLayer(droneLayerName);
layer.showCube( !layer.isShowCube() );
}
function showDroneCube( visible )
{
/*
// cube를 안보이게 설정하고.
var layer = cmworldViewer.getLayer(droneLayerName);
layer.showCube(!visible);*/
showCubeAroundDrone(visible);
}
function showExtraCube() {
var layer = cmworldViewer.getLayer(droneLayerName);
layer.showExtraCube(!layer.isShowExtraCube());
}
var cubeAlpha = 0.0;
function setAlphaMode() {
var layer = cmworldViewer.getLayer(droneLayerName);
cubeAlpha += 0.2;
if (cubeAlpha > 1.0) {
cubeAlpha = 0.2;
}
layer.setCubeAlpha(cubeAlpha);
}
var startpt;
var endpt;
Pathfinding = function () {
var userLayer = getUserLayer();
userLayer.clear();
cmworldViewer.mouse.setMouseMode(CMWORLD.MouseMode.drawSimpleline);
cmworldViewer.mouse.userDrawHandler.callbackEndEditing = function (editingPointList, currObjectType) {
if (CMWORLD.GisObjectType.simpleline == currObjectType) {
var ptlist = [];
for (var key in editingPointList) {
editingPointList[key].x;
editingPointList[key].y;
editingPointList[key].z;
ptlist.push(editingPointList[key]);
//console.log(editingPointList[key].x + "," + editingPointList[key].y + ", " + editingPointList[key].z);
}
//cmworldViewer.mouse.setMouseMode(CMWORLD.MouseMode.normal);
if (window.getSelection) {
if (window.getSelection().empty) { // Chrome
window.getSelection().empty();
}
else if (window.getSelection().removeAllRanges) { // Firefox
window.getSelection().removeAllRanges();
}
}
else if (document.selection) { // IE?
document.selection.empty();
}
if (ptlist.length == 2) {
startpt = ptlist[0].clone();
endpt = ptlist[1].clone();
ptlist[0].z += 20;
ptlist[1].z += 20;
var ptrequest = "http://cmworld.net:5050/CmWorld/CmWorldServlet?T=drone2016_cube&command=getpath&L=14";
ptrequest = ptrequest + "&X1=" + ptlist[0].x.toString();
ptrequest = ptrequest + "&Y1=" + ptlist[0].y.toString();
ptrequest = ptrequest + "&Z1=" + ptlist[0].z.toString();
ptrequest = ptrequest + "&X2=" + ptlist[1].x.toString();
ptrequest = ptrequest + "&Y2=" + ptlist[1].y.toString();
ptrequest = ptrequest + "&Z2=" + ptlist[1].z.toString();
ptrequest = ptrequest + "&MAXH=200";
//console.log(ptrequest);
CMWORLD.NetWork.requestFile(ptrequest, function (params) {
if (params.response) {
console.log(startpt);
var responseText = params.response;
var lineStringList = responseText.split(/[\s,]+/);
var koreaGeoPts = [];
koreaGeoPts.push(startpt);
for (i = 0; i < lineStringList.length; i += 3) {
var lon = parseFloat(lineStringList[i]);
var lat = parseFloat(lineStringList[i + 1]);
var height = parseFloat(lineStringList[i + 2]);
koreaGeoPts.push(new THREE.Vector3(lon, lat, height));
}
koreaGeoPts.push(endpt);
setDronePath(koreaGeoPts);
}
}, null, false, "text");
}
// 취소
return false;
//return true;
}
}
/*
var userLayer = getUserLayer();
//userLayer.clear();
// 특수라인 : 라인에 모양을 넣어서 해보자
{
var ptlist = [];
ptlist.push(new THREE.Vector3(127.09026010995666, 35.78121555911689, 80.38087760005146));
ptlist.push(new THREE.Vector3(127.089111328125, 35.78115234375, 80.0));
ptlist.push(new THREE.Vector3(127.0890625, 35.78115234375, 85.0));
ptlist.push(new THREE.Vector3(127.0888671875, 35.78115234375, 85.0));
ptlist.push(new THREE.Vector3(127.088818359375, 35.781201171875, 90.0));
ptlist.push(new THREE.Vector3(127.08876953125, 35.781201171875, 90.0));
ptlist.push(new THREE.Vector3(127.088720703125, 35.781201171875, 85.0));
ptlist.push(new THREE.Vector3(127.088671875, 35.781201171875, 90.0));
ptlist.push(new THREE.Vector3(127.08828125, 35.781201171875, 90.0));
ptlist.push(new THREE.Vector3(127.088232421875, 35.781201171875, 95.0));
ptlist.push(new THREE.Vector3(127.0880859375, 35.781201171875, 95.0));
ptlist.push(new THREE.Vector3(127.087890625, 35.781005859375, 115.0));
ptlist.push(new THREE.Vector3(127.087841796875, 35.78095703125, 115.0));
ptlist.push(new THREE.Vector3(127.08779296875, 35.780908203125, 120.0));
ptlist.push(new THREE.Vector3(127.087744140625, 35.780859375, 115.0));
ptlist.push(new THREE.Vector3(127.0876953125, 35.780859375, 120.0));
ptlist.push(new THREE.Vector3(127.08759765625, 35.78076171875, 120.0));
ptlist.push(new THREE.Vector3(127.087548828125, 35.780712890625, 125.0));
ptlist.push(new THREE.Vector3(127.0875, 35.7806640625, 120.0));
ptlist.push(new THREE.Vector3(127.087451171875, 35.780615234375, 125.0));
ptlist.push(new THREE.Vector3(127.08740234375, 35.78056640625, 125.0));
ptlist.push(new THREE.Vector3(127.087353515625, 35.78056640625, 130.0));
ptlist.push(new THREE.Vector3(127.0873046875, 35.780517578125, 130.0));
ptlist.push(new THREE.Vector3(127.087158203125, 35.78037109375, 145.0));
ptlist.push(new THREE.Vector3(127.087060546875, 35.7802734375, 145.0));
ptlist.push(new THREE.Vector3(127.08701171875, 35.780224609375, 150.0));
ptlist.push(new THREE.Vector3(127.086962890625, 35.78017578125, 150.0));
ptlist.push(new THREE.Vector3(127.0869140625, 35.780126953125, 145.0));
ptlist.push(new THREE.Vector3(127.08671875, 35.779931640625, 165.0));
ptlist.push(new THREE.Vector3(127.086669921875, 35.7798828125, 160.0));
ptlist.push(new THREE.Vector3(127.0865234375, 35.779736328125, 160.0));
ptlist.push(new THREE.Vector3(127.086474609375, 35.7796875, 155.0));
ptlist.push(new THREE.Vector3(127.086376953125, 35.77958984375, 155.0));
ptlist.push(new THREE.Vector3(127.086328125, 35.779541015625, 150.0));
ptlist.push(new THREE.Vector3(127.086181640625, 35.77939453125, 150.0));
ptlist.push(new THREE.Vector3(127.0861328125, 35.779345703125, 145.0));
ptlist.push(new THREE.Vector3(127.085986328125, 35.77919921875, 145.0));
ptlist.push(new THREE.Vector3(127.0859375, 35.779150390625, 140.0));
ptlist.push(new THREE.Vector3(127.085693359375, 35.77890625, 140.0));
ptlist.push(new THREE.Vector3(127.08564453125, 35.778857421875, 135.0));
ptlist.push(new THREE.Vector3(127.08544921875, 35.778662109375, 135.0));
ptlist.push(new THREE.Vector3(127.085400390625, 35.77861328125, 130.0));
ptlist.push(new THREE.Vector3(127.0853515625, 35.77861328125, 125.0));
ptlist.push(new THREE.Vector3(127.085302734375, 35.778564453125, 120.0));
ptlist.push(new THREE.Vector3(127.08525390625, 35.778515625, 120.0));
ptlist.push(new THREE.Vector3(127.085205078125, 35.778466796875, 125.0));
ptlist.push(new THREE.Vector3(127.08515625, 35.77841796875, 120.0));
ptlist.push(new THREE.Vector3(127.085107421875, 35.77841796875, 115.0));
ptlist.push(new THREE.Vector3(127.08505859375, 35.778369140625, 110.0));
ptlist.push(new THREE.Vector3(127.0849609375, 35.778271484375, 110.0));
ptlist.push(new THREE.Vector3(127.084912109375, 35.77822265625, 115.0));
ptlist.push(new THREE.Vector3(127.084716796875, 35.77802734375, 95.0));
ptlist.push(new THREE.Vector3(127.08466796875, 35.777978515625, 95.0));
ptlist.push(new THREE.Vector3(127.084619140625, 35.7779296875, 100.0));
ptlist.push(new THREE.Vector3(127.08464890721112, 35.77794960580456, 101.48118303157389));
var earthRadius = CMWORLD.cm_const.EarthRadius;
var earthpts = [];
var origin = CMWORLD.CmMathEngine.Geo2Cartesian(ptlist[0].x, ptlist[0].y, ptlist[0].z + earthRadius)
for (var i = 0; i < ptlist.length; i++)
{
var pt = CMWORLD.CmMathEngine.Geo2Cartesian(ptlist[i].x, ptlist[i].y, ptlist[i].z + earthRadius);
pt.x = pt.x - origin.x;
pt.y = pt.y - origin.y;
pt.z = pt.z - origin.z;
earthpts.push(pt);
}
var randomSpline = new THREE.CatmullRomCurve3(earthpts);
var extrudeSettings = {
steps: 100,
bevelEnabled: true,
extrudePath: randomSpline
};
var pts = [], numPts = 8;
for (var i = 0; i < numPts * 2; i++)
{
var radius = 1;
var l = i % 2 == 1 ? radius : radius * 2;
var a = i / numPts * Math.PI;
pts.push(new THREE.Vector2(Math.cos(a) * l, Math.sin(a) * l));
}
var shape = new THREE.Shape(pts);
var geometry = new THREE.ExtrudeGeometry(shape, extrudeSettings);
var color = new THREE.Color(0xffff00);
var material = new THREE.MeshBasicMaterial({
color: 0xCC000F,
shading: THREE.SmoothShading,
ambient: 0x555555,
specular: 0xffffff
});
var mesh = new THREE.Mesh(geometry, material);
shipTrackPoisition = new THREE.Vector3(ptlist[0].x, ptlist[0].y, 100);
shipTrackRealObj = new CMWORLD.UserObject(name, mesh, shipTrackPoisition, null);
userLayer.add(shipTrackRealObj);
}
*/
}
init = function () {
var layer = cmworldViewer.getLayer(droneLayerName);
//
// 기본 color값.
var colorHashTable = new Array();
{
colorHashTable[0] = new THREE.Vector4(0, 0, 0, 1);
colorHashTable[1] = new THREE.Vector4(1, 0, 0, 0.6);
colorHashTable[2] = new THREE.Vector4(1, 0, 1, 0.6);
colorHashTable[3] = new THREE.Vector4(0, 1, 1, 0.6);
colorHashTable[4] = new THREE.Vector4(0, 0, 1, 0.6);
// 여기서 부턴 outsidecude
var next = CMWORLD.CubeGroupLayer.outSideCubeColorIndex;
colorHashTable[next+0] = new THREE.Vector4(0, 0, 0, 0.3);
colorHashTable[next+1] = new THREE.Vector4(1, 1, 0, 0.3);
colorHashTable[next+2] = new THREE.Vector4(1, 1, 1, 0.3);
}
layer.setColorHashTable(colorHashTable);
}
window.onload = function () {
var canvas = document.querySelector("#cmworldCanvas");
canvas.onclick = mouseClick;
// canvas 지정, 시작 위치 지정
// cmworldData
cmworldViewer = new CMWORLD.CmWorld3(canvas, 127, 37.5, 10000);
cmworldViewer.addTileImageLayer("base", "http://cmworld.net:5050/CmWorld/CmWorldServlet?T=drone2016_raster&L={z}&X={x}&Y={y}", 0, 14, 90, -90, -180, 180, "jpg", false);
cmworldViewer.addTerrainLayer("terrain", "http://cmworld.net:5050/CmWorld/CmWorldServlet?T=drone2016_dem&L={z}&X={x}&Y={y}", 0, 14, 90, -90, -180, 180, "CBT");
cmworldViewer.addCubeGroupLayer(droneLayerName, "http://cmworld.net:5050/CmWorld/CmWorldServlet?T=drone2016_cube&L={l}&X={x}&Y={y}", 13, 14, "cube");
//cmworldViewer.addCubeGroupLayer(droneLayerName, "http://cmworld.net:5050/CmWorld/CmWorldServlet?T=cubefordrone&L={l}&X={x}&Y={y}", 13, 14, "cube");
cmworldViewer.showLatLonLine(true);
init();
droneGilExam();
};
addToLine = function (str) {
var lines = coordtext.value + str;
coordtext.value = lines;
}
mouseClick = function (event) {
if (event) {
if (event.shiftKey) {
if (cmworldViewer) {
var mousePos = cmworldViewer.convertPagePosToCanvasPos(event.pageX, event.pageY);
var pos = cmworldViewer.getHitCoordinate(mousePos.x, mousePos.y);
if (pos) {
var coordtext = document.getElementById("coordtext");
if (coordtext) {
//1, 35.76542977702486, 127.10074905539868, 64.70060381293297, 0.0
var str = "1, " + pos.y.toString() + ", " + pos.x.toString() + ", " + pos.z.toString() + ", 0.0\n";
addToLine(str);
}
}
}
}
else if (event.ctrlKey) {
var mousePos = cmworldViewer.convertPagePosToCanvasPos(event.pageX, event.pageY);
if (cmworldViewer) {
var info = cmworldViewer.getHitInformationOnObject(mousePos.x, mousePos.y);
if (info) {
if (info.hasOwnProperty("key")) {
addToLine(info.key + "\n");
}
// 이걸 통해서 CmUserObject의 정보를 얻을 수 있다.
if (info.userObject) {
var cmUserObject = info.userObject;
addToLine(cmUserObject.name);
}
// 이건 threejs object 정보
if (info.hasOwnProperty("object")) {
addToLine(info.object.toString());
}
}
}
}
else if (event.altKey) {
// camera의 현재 상태 값을 돌려 준다.
var camerapos = cmworldViewer.getCamera().getPositionGeo();
var lookpos = cmworldViewer.getCamera().getLookPositionGeo();
if (camerapos) {
var coordtext = document.getElementById("coordtext");
if (coordtext) {
var str = "camera(" + camerapos.x.toString() + ", " + camerapos.y.toString() + ", " + camerapos.z.toString() + ")\n"
+ "look (" + lookpos.x.toString() + ", " + lookpos.y.toString() + ", " + lookpos.z.toString() + ")\n";
addToLine(str);
}
}
}
}
}
</script>
</head>
<body>
<canvas id="cmworldCanvas"></canvas>
<div id="container"></div>
<div id="labelDiv">
* 3차원 공간 격자체계 <br>
</div>
<textarea id="coordtext" rows="30" cols="30" style="background: rgb(255, 255, 255); bottom: 5px; left: 5px; width: 700px; height: 50px; position: absolute; overflow-y: scroll;"></textarea>
<a href="#" onclick="showCube()" style="right: 10px; top: 20px; position: absolute; z-index: 10000;color: rgb(0, 255, 0)">OnOff Cube</a>
<a href="#" onclick="showExtraCube()" style="right: 10px; top: 40px; position: absolute; z-index: 10000;color: rgb(0, 255, 0)">OnOff ExtraCube</a>
<a href="#" onclick="setAlphaMode()" style="right: 10px; top: 60px; position: absolute; z-index: 10000;color: rgb(0, 255, 0)">set CubeAlphaMode</a>
<a href="#" onclick="showPointCloud()" style="right: 10px; top: 100px; position: absolute; z-index: 10000;color: rgb(0, 255, 0)">showPointCloud</a>
<a href="#" onclick="setTileInfo()" style="right: 10px; top: 120px; position: absolute; z-index: 10000;color: rgb(0, 255, 0)">TileInfo</a>
<a href="#" onclick="initDronePath()" style="right: 10px; top: 160px; position: absolute; z-index: 10000;color: rgb(0, 255, 0)">set DronePath</a>
<a href="#" onclick="showDronePathCube(!showDronePathCubeFlag)" style="right: 10px; top: 180px; position: absolute; z-index: 10000;color: rgb(0, 255, 0)">showPathCube</a>
<a href="#" onclick="flyDrone()" style="right: 10px; top: 240px; position: absolute; z-index: 10000;color: rgb(0, 255, 0)">flyDrone</a>
<a href="#" onclick="showDroneCube(!showCubeAroundDroneFlag)" style="right: 10px; top: 260px; position: absolute; z-index: 10000;color: rgb(0, 255, 0)">showDroneCube</a>
<a href="#" onclick="setDroneFlyMode()" style="right: 10px; top: 280px; position: absolute; z-index: 10000;color: rgb(0, 255, 0)">setDroneFlyMode</a>
<a href="#" onclick="gotoJunju()" style="right: 10px; top: 380px; position: absolute; z-index: 10000;color: rgb(0, 255, 255)">전주지역</a>
<a href="#" onclick="gotoYeongwol()" style="right: 10px; top: 400px; position: absolute; z-index: 10000;color: rgb(0, 255, 255)">영월지역</a>
</body>
</html>