<!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;
example = function ()
{
// 스타일 지정
var style = new CMWORLD.StyleInfo();
style.fillStyle = "rgba(140, 140, 140, 1)";
style.strokeStyle = "rgba(0, 0, 255, 0.5)";
style.lineWidth = 3;
cmworld.styleManager.addStyle("cmw:GG03IG", style);
// 카메라
var eye_x = 127.10015812001154;
var eye_y = 37.51323781038761;
var eye_h = 500;
var look_x = 127.10015812001154;
var look_y = 37.51323781038761;
var look_h = 14.624387037940323;
cmworld.gotoLookAt(eye_x, eye_y, eye_h, look_x, look_y, look_h);
}
removeLayer = function ()
{
cmworld.removeVectorImageLayer("cmw:GG03IG");
};
addLayer = function ()
{
//http://192.168.0.250:8080/platform/cmw/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=cmw:GG03IG&outputFormat=application%2Fjson&bbox=206051.328125,540829.5,214243.96875,549218.75
cmworld.addVectorImageLayer("cmw:GG03IG", "http://192.168.0.250:8080/platform/cmw/ows", "http://192.168.0.250:8080/platform/cmw/ows", "cmw:GG03IG", 14, [10,11, 12, 13, 14], 90, -90, -180, 180, "json");
cmworld.redrawVectorImageLayer("cmw:GG03IG");
};
window.onload = function ()
{
var canvas = document.querySelector("#cmworldCanvas");
cmworld = new CMWORLD.CmWorld3(canvas, 127, 38, CMWORLD.cm_const.EarthRadius);
cmworld.option.worldTimer.setStartDateTime(2015, 7, 12, 14, 0, 0, 0);
cmworld.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);
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.option.viewTileInfo = true;
if (CMWORLD.Compile.DistributionMode == false)
{
cmworld.option.showFPS(true);
}
example();
};
</script>
</head>
<body>
<canvas id="cmworldCanvas"></canvas>
<!--div style="background:rgb(255, 255, 255); bottom : 10px; left: 10px; width:256px; height:256px; position: absolute;">
<canvas id="debugimage" style="width:100%;height:100%;"></canvas>
</div-->
<a href="#" onclick="removeLayer()" style="right: 10px; top: 20px; position: absolute; z-index: 10000;color: rgb(182, 255, 0)">removeLayer</a>
<a href="#" onclick="addLayer()" style="right: 10px; top: 40px; position: absolute; z-index: 10000;color: rgb(182, 255, 0)">addLayer</a>
</body>
</html>