Yahoo! UI Library

CHZERO  1.0.0

Yahoo! UI Library > CHZERO > ZeroMap.js (source view)
Search:
 
Filters
/**
 * map
 * @class ZeroMap
 * @extends OpenLayers.Map
 * @constructor
 * @namespace CHZERO
 * @param {DOMElement | String} div HTML엘리먼트 또는 ID
 * @param {Object} option 지도 옵션
 */
CHZERO.ZeroMap = OpenLayers.Class(OpenLayers.Map,
{
	CLASS_NAME: 'CHZERO.Map.ZeroMap',
	
	/**
	 * 지도 이미지 포맷
	 * @property format
	 * @type {String}
	 */
	format: 'image/png',
	
	/**
	 * 길찾기 cns 클래스
	 * @property cns
	 * @type {CHZERO.Control.Cns}
	 */
	cns: null,

	/**
	 * 레이어 hashtable<br/>
	 * BACKGROUND - {OpenLayers.Layer.WMS} 배경 레이어<br/>
	 * POI - {OpenLayers.Layer.WMS} POI 레이어<br/>
	 * VECTOR - {OpenLayers.Layer.Vector} 백터 레이어<br/>
	 * MARKER - {CHZERO.Layer.ZeroMapMarkers} 마커 레이어<br/>
	 * @property layerMap
	 * @type {Object}
	 */
	layerMap: null,
	
	zoom: 0,
	
	center: null,
	
	eventListeners: null,
	
	globalVarName: null,

	zeromapHover: null,

	zeromapClick: null,

	panZoomBarControl: null,

	frame: null,

	form: null,

	panel: null,

	eraser: null,
	
	calculateResolutions: function(ext, unit, cnt) {
		if (!ext) ext = this.maxExtent;
		if (!unit) unit = this.units;
		if (!cnt) cnt = this.numZoomLevels;
		var ms = 591658710.909130; /*((ext.right - ext.left) / OpenLayers.Map.TILE_WIDTH) * OpenLayers.Map.PIXELS_PER_CM * 100.0;*/
		/*var res = 156543.03390625;*/
		var res = 2445.9849047851562;
		/*var res = OpenLayers.Util.getResolutionFromScale(ms, unit);*/
		var arr = [res];
		for (i = 1; i < cnt; i++) {
			arr[i] = arr[i - 1] / 2;
		}
		return arr;
	},
	
	initControl: function() {
		var ctr = [];
		ctr.push(new OpenLayers.Control.Attribution());
		/*this.addControl(new OpenLayers.Control.MousePosition());*/
		if (!CHZERO.isMobile) {
			ctr.push(new OpenLayers.Control.Navigation(/*{mouseWheelOptions: {interval: 50}}*/
			{dragPanOptions: { enableKinetic: true} }));
			ctr.push(this.panZoomBarControl = new OpenLayers.Control.PanZoomBar());
			ctr.push(new OpenLayers.Control.ScaleLine(/*{geodesic: true}*/));
		}
		else {
			ctr.push(new OpenLayers.Control.TouchNavigation(/*{mouseWheelOptions: {interval: 50}}*/
		{dragPanOptions: { enableKinetic: true} }));
			ctr.push(this.panZoomBarControl = new OpenLayers.Control.ZoomPanel({ 'position': new OpenLayers.Pixel(10, 10) }));
		}
		this.zeromapHover = new CHZERO.Control.ZeroMapHover({ handlerOptions: {
			'delay': 50
		}
		});
		ctr.push(this.zeromapHover);
		this.zeromapClick = new CHZERO.Control.ZeroMapClick({ handlerOptions: {
			'single': true
		}
		});
		ctr.push(this.zeromapClick);

		return ctr;
	},

	initLayer: function(ext) {
		if (!ext) ext = this.maxExtent;
		lys = [];
		if (CHZERO.bgLayer && CHZERO.bgLayer.length > 0) {
			lys.push(new OpenLayers.Layer.WMS('n_bg Geoserver layers - Tiled', CHZERO.wmsUrl,
				{ 'LAYERS': CHZERO.bgLayer,
					'format': this.format,
					'tiled': true,
					/*'tilesOrigin': ext.left + ',' + ext.bottom*/
					'resolutions': this.resolutions
				},
			{ 'buffer': 0, 'displayOutsideMaxExtent': true, 'transitionEffect': 'resize', 'attribution': 'Provided by CHZERO' }));
		}
		if (CHZERO.txtLayer && CHZERO.txtLayer.length > 0) {
			lys.push(new OpenLayers.Layer.WMS(
			'n_text Geoserver layers - Tiled', CHZERO.wmsUrl,
			{
				LAYERS: CHZERO.txtLayer,
				format: this.format,
				tiled: true,
				/*tilesOrigin: ext.left + ',' + ext.bottom,*/
				resolutions: this.resolutions,
				transparent: true
			},
			{
				buffer: 0,
				displayOutsideMaxExtent: true,
				transitionEffect: 'resize',
				alpha: true
			}));
		}
		lys.push(this.createVectorLayer());
		lys.push(new CHZERO.Layer.ZeroMapMarkers());
		this.layerMap = { BACKGROUND: lys[0],
			POI: lys[1],
			VECTOR: lys[2],
			MARKER: lys[3]
		};
		return lys;
	},

	createVectorLayer: function() {
		ly = new OpenLayers.Layer.Vector('My Vector Layer');
		if (!this.measureStyleMap) {
			measureSymbolizers = {
				'Point': {
					pointRadius: 6,
					graphicName: 'square',
					fillColor: '#FFFFFF',
					fillOpacity: 0.8,
					strokeWidth: 1,
					strokeOpacity: 1,
					strokeColor: '#FF0000'/*,
					label:'${index}'*/
				},
				'Line': {
					strokeWidth: 5,
					strokeOpacity: 0.5,
					strokeColor: '#FF0000'
					/*strokeDashstyle: 'dashdot'*/
				},
				'Polygon': {
					strokeWidth: 2,
					strokeOpacity: 1,
					strokeColor: '#666666',
					fillColor: '#6887F1',
					fillOpacity: 0.5
				}
			};
			measureStyle = new OpenLayers.Style();
			measureStyle.addRules([
				new OpenLayers.Rule({ symbolizer: measureSymbolizers })]);
			this.measureStyleMap = new OpenLayers.StyleMap({ 'default': measureStyle });
		}
		ly.styleMap = this.measureStyleMap;
		return ly;
	},

	initialize: function(div, options) {

		if (arguments.length === 1 && typeof div === "object") {
			options = div;
			div = options && options.div;
		}

		this.tileSize = new OpenLayers.Size(OpenLayers.Map.TILE_WIDTH,
									OpenLayers.Map.TILE_HEIGHT);

		this.paddingForPopups = new OpenLayers.Bounds(15, 15, 15, 15);
		this.maxExtent = new OpenLayers.Bounds(
		/*12801630.122, 3503549.844,
		15584728.711, 5780669.727*/
		/*-20037508.34278920, -20037508.34278920,
		20037508.34278920, 20037508.34278920*/
				-20037508.34, -20037508.34, 20037508.34, 20037508.34);
		this.theme = OpenLayers._getScriptLocation() +
					 'theme/default/style.css';
		if (!options) options = {};
		else OpenLayers.Util.extend(this, options);
		if (!options["projection"]) {
			options["projection"] = 'EPSG:900913';
		}
		if (!options["displayProjection"]) {
			options["displayProjection"] = new OpenLayers.Projection('EPSG:4326');
		}
		if (!options["numZoomLevels"]) {
			options["numZoomLevels"] = 14;
		}
		if (!options["units"]) {
			options["units"] = 'm';
		}
		if (!options["zoom"]) {
			options["zoom"] = 0;
		}
		if (!options["center"]) {
			options["center"] = new OpenLayers.LonLat(14135108.268190, 4518344.320307);
		}

		if (!options["maxExtent"]) {
			options["maxExtent"] = new OpenLayers.Bounds(
			/*12801630.122, 3503549.844,
			15584728.711, 5780669.727*/
				-20037508.34, -20037508.34,
				20037508.34, 20037508.34);
		}
		if (!options["resolutions"]) {
			options["resolutions"] = this.calculateResolutions(options["maxExtent"], options["units"], options["numZoomLevels"]);
			/*options["resolutions"] = [156543.03390625, 78271.516953125, 39135.7584765625, 19567.87923828125, 9783.939619140625, 4891.9698095703125, 2445.9849047851562, 1222.9924523925781, 611.4962261962891, 305.74811309814453, 152.87405654907226, 76.43702827453613, 38.218514137268066, 19.109257068634033, 9.554628534317017, 4.777314267158508, 2.388657133579254, 1.194328566789627, 0.5971642833948135, 0.29858214169740677, 0.14929107084870338, 0.07464553542435169, 0.037322767712175846, 0.018661383856087923, 0.009330691928043961, 0.004665345964021981];*/
		}
		if (!options["layers"]) {
			options["layers"] = this.initLayer(options["maxExtent"]);
		}
		if (!options["controls"]) {
			options["controls"] = this.initControl();
		}

		OpenLayers.Util.extend(this, options);

		this.layers = [];

		this.id = OpenLayers.Util.createUniqueID("OpenLayers.Map_");

		this.div = OpenLayers.Util.getElement(div);
		if (!this.div) {
			this.div = document.createElement("div");
			this.div.style.height = "1px";
			this.div.style.width = "1px";
		}

		OpenLayers.Element.addClass(this.div, 'olMap');

		var id = this.id + "_OpenLayers_ViewPort";
		this.viewPortDiv = OpenLayers.Util.createDiv(id, null, null, null,
											 "relative", null,
											 "hidden");
		this.viewPortDiv.style.width = "100%";
		this.viewPortDiv.style.height = "100%";
		this.viewPortDiv.className = "olMapViewport";
		this.div.appendChild(this.viewPortDiv);

		var eventsDiv = document.createElement("div");
		eventsDiv.id = this.id + "_events";
		eventsDiv.style.position = "absolute";
		eventsDiv.style.width = "100%";
		eventsDiv.style.height = "100%";
		eventsDiv.style.zIndex = this.Z_INDEX_BASE.Control - 1;
		this.viewPortDiv.appendChild(eventsDiv);
		this.eventsDiv = eventsDiv;
		this.events = new OpenLayers.Events(
		this, this.eventsDiv, this.EVENT_TYPES, this.fallThrough,
		{ includeXY: true }
		);

		id = this.id + "_OpenLayers_Container";
		this.layerContainerDiv = OpenLayers.Util.createDiv(id);
		this.layerContainerDiv.style.zIndex = this.Z_INDEX_BASE['Popup'] - 1;

		this.eventsDiv.appendChild(this.layerContainerDiv);

		this.updateSize();
		if (this.eventListeners instanceof Object) {
			this.events.on(this.eventListeners);
		}

		this.events.register("movestart", this, this.updateSize);

		if (OpenLayers.String.contains(navigator.appName, "Microsoft")) {
			this.events.register("resize", this, this.updateSize);
		} else {
			this.updateSizeDestroy = OpenLayers.Function.bind(this.updateSize,
		    this);
			OpenLayers.Event.observe(window, 'resize',
					this.updateSizeDestroy);
		}

		if (this.theme) {
			var addNode = true;
			var nodes = document.getElementsByTagName('link');
			for (var i = 0, len = nodes.length; i < len; ++i) {
				if (OpenLayers.Util.isEquivalentUrl(nodes.item(i).href,
										   this.theme)) {
					addNode = false;
					break;
				}
			}
			if (addNode) {
				var cssNode = document.createElement('link');
				cssNode.setAttribute('rel', 'stylesheet');
				cssNode.setAttribute('type', 'text/css');
				cssNode.setAttribute('href', this.theme);
				document.getElementsByTagName('head')[0].appendChild(cssNode);
			}
		}
		if (this.controls == null) {
			if (OpenLayers.Control != null) { /* running full or lite?*/
				this.controls = [new OpenLayers.Control.Navigation(),
						  new OpenLayers.Control.PanZoom(),
						  new OpenLayers.Control.ArgParser(),
						  new OpenLayers.Control.Attribution()
						];
			} else {
				this.controls = [];
			}
		}

		for (var i = 0, len = this.controls.length; i < len; i++) {
			this.addControlToMap(this.controls[i]);
		}
		if (this.zeromapHover)
			this.zeromapHover.activate();
		if (this.zeromapClick)
			this.zeromapClick.activate();
		this.popups = [];

		this.unloadDestroy = OpenLayers.Function.bind(this.destroy, this);


		OpenLayers.Event.observe(window, 'unload', this.unloadDestroy);

		if (options && options.layers) {
			delete this.center;
			this.addLayers(options.layers);
			if (options.center) {
				this.setCenter(options.center, options.zoom);
			}
		}

		this.frame = document.createElement("iframe");
		this.frame.style.width = '0px';
		this.frame.style.height = '0px';
		this.frame.style.display = 'none';
		this.frame.id = this.frame.name = OpenLayers.Util.createUniqueID('ZeromapFrame');
		document.body.appendChild(this.frame);
		this.form = document.createElement('form');
		this.form.method = 'POST';
		this.form.appendChild(CHZERO.createInput('hidden', 'geoJson', ''));
		this.form.appendChild(CHZERO.createInput('hidden', 'ver', CHZERO.version));
		this.form.appendChild(CHZERO.createInput('hidden', 'authKey', CHZERO.authKey));
		this.frame.appendChild(this.form);

		/*var nav = new OpenLayers.Control.NavigationHistory();
		this.addControl(nav);*/
		/*parent control must be added to the map*/
		/*nav.next.title = '다음';
		nav.previous.title = '이전';*/

		this.panel = new OpenLayers.Control.Panel({ position: new OpenLayers.Pixel(17, 270) });
		var path = this.createMeasureControl(OpenLayers.Handler.Path, '거리재기');
		var polygon = this.createMeasureControl(OpenLayers.Handler.Polygon, '면적재기');
		this.eraser = new CHZERO.Control.ZeroMapMeasureErase({ title: '지우기', measures: [path, polygon] });
		this.panel.addControls([
		/*nav.next, nav.previous,*/
            new CHZERO.Control.ZeroMapZoomBox({ title: '줌박스:확대할 부분을 드래그 선택해주세요.' }),
            path,
            polygon,
			this.eraser
		]);
		this.addControl(this.panel);
		this.panel.deactivate();
	},
	
	destroy: function() {
		if (!this.unloadDestroy) {
			return false;
		}
		if (this.panTween) {
			this.panTween.stop();
			this.panTween = null;
		}
		OpenLayers.Event.stopObserving(window, 'unload', this.unloadDestroy);
		this.unloadDestroy = null;
		if (this.updateSizeDestroy) {
			OpenLayers.Event.stopObserving(window, 'resize',
                                           this.updateSizeDestroy);
		} else {
			this.events.unregister("resize", this, this.updateSize);
		}

		this.paddingForPopups = null;

		if (this.controls != null) {
			for (var i = this.controls.length - 1; i >= 0; --i) {
				if (this.controls[i] != null)
					this.controls[i].destroy();
			}
			this.controls = null;
		}
		if (this.layers != null) {
			for (var i = this.layers.length - 1; i >= 0; --i) {
				if (this.layers[i] != null)
					this.layers[i].destroy(false);
			}
			this.layers = null;
		}
		if (this.popups != null) {
			var p = null;
			while (this.popups.length > 0) {
				p = this.popups[0];
				this.removePopup(p);
				p.destroy();
				p = null;
			}
			this.popups = null;
			p = null;
		}
		if (this.viewPortDiv) {
			this.div.removeChild(this.viewPortDiv);
		}
		this.viewPortDiv = null;

		if (this.eventListeners) {
			this.events.un(this.eventListeners);
			this.eventListeners = null;
		}
		this.events.destroy();
		this.events = null;
		this.cns = null;

		this.layerMap = null;
		if (this.zeromapHover) {
			this.zeromapHover.destroy();
			this.zeromapHover = null;
		}
		if (this.zeromapClick) {
			this.zeromapClick.destroy();
			this.zeromapClick = null;
		}


		this.panZoomBarControl = null;

		if (this.frame) {
			if (this.form) {
				this.frame.removeChild(this.form);
				this.form = null;
			}
			document.body.removeChild(this.frame);
			this.frame = null;
		}

		this.panel = null;

		this.eraser = null;
	},

	setLayerZIndex: function(layer, zIdx) {
		var offset = 5;
		var zIndex = this.Z_INDEX_BASE[layer.isBaseLayer ? 'BaseLayer' : 'Overlay']
            + zIdx * offset;
		layer.setZIndex(zIndex);
		if (this.layerMap && this.layerMap.VECTOR && this.layerMap.VECTOR.div) {
			zIndex += offset;
			this.layerMap.VECTOR.setZIndex(zIndex);
		}
		if (this.layerMap && this.layerMap.MARKER && this.layerMap.MARKER.div) {
			zIndex += offset;
			this.layerMap.MARKER.setZIndex(zIndex);
		}
		if (this.cns && this.cns.cnsLayer && this.cns.cnsLayer.div) {
			zIndex += offset;
			this.cns.cnsLayer.setZIndex(zIndex);
		}
	},
	/**
	* 명칭 정보 찾기<br/>
	* 명칭 정보를 받아서 위치 및 주소 정보를 가져온다.
	* <strong>data</strong> - <br/>
	* sido : {String}시도<br/>
	* sigungu : {String}시군구<br/>
	* lawCode - {String}법정코드. null 허용<br/>
	* word - {String}찾을 명칭<br/>
	* @method searchPoi
	* @param {Object} data 명칭 정보
	* @param {Object} callback 콜백 함수
	*/
	searchPoi: function(data, callback) {
		var str = JSON.stringify(data);
		var arr = { data: str, ver: CHZERO.version, authKey: CHZERO.authKey, varName: this.globalVarName };
		var url = CHZERO.webUrl + '/GetPoiJson.aspx';
		var map = this;
		var req = new OpenLayers.Protocol.Script({
			url: url,
			params: arr,
			callback: function(res) {
				var data = res.data;
				(callback && typeof callback === 'function') ? callback(data) : (function() {
					if ('undefined' != typeof (data) && data && data.properties) {
						if (data.properties.status == 'error') {
							alert(data.properties.statusDetail);
						}
						else {
							var geojson_format = new OpenLayers.Format.GeoJSON();
							var collection = geojson_format.read(data);

							for (var i = 0; i < collection.length; i++) {
								var feat = collection[i];
								feat.geometry.transform(map.displayProjection, map.getProjectionObject());
								var jibun = feat.data;
								var str = jibun.sido + ' ' + jibun.sigungu + '<BR/>';
								str += jibun.lawEmd;
								if (jibun.li && jibun.li.length > 0)
									str += ' ' + jibun.li;
								if (jibun.bunji && jibun.bunji.length > 0) {
									if (jibun.isSan)
										str += ' 산';
									str += ' ' + jibun.bunji;
									if (jibun.ho && jibun.ho.length > 0)
										str += '-' + jibun.ho;
									str += ' 번지';
								}
								str = "<strong>" + jibun.name + "</strong><br/>" + str;
								/*obj.addMarker(null,feat.geometry.x,feat.geometry.y,str);*/
								var marker = map.addMarkerPopup(feat.geometry.x, feat.geometry.y, { popupContentHTML: str });

								if (i == 0)
									marker.events.triggerEvent('mousedown', null);

							}
							var markerLayer = map.layerMap.MARKER;
							var ex = markerLayer.getDataExtent();
							if (ex != null) {
								map.zoomToExtent(ex);
								map.zoomOut();
							}
						}

					}
				} ());
			}
		});
		req.read();
	},
	/**
	* 지번 주소 정보 찾기<br/>
	* 지번 주소 정보를 받아서 위치 및 도로명 주소 정보를 가져온다.
	* <strong>data</strong> - <br/>
	* sido : {String}시도<br/>
	* sigungu : {String}시군구<br/>
	* dong - {String}동읍면<br/>
	* li - {String}리<br/>
	* bunji - {String}번지<br/>
	* ho - {String}호<br/>
	* isSan - {String}산이면 1 아니면 0
	* @method searchAddr
	* @param {Object} data 지번 주소 정보
	* @param {Object} callback 콜백 함수
	*/
	searchAddr: function(data, callback, options) {
		var str = JSON.stringify(data);
		var arr = { data: str, ver: CHZERO.version, authKey: CHZERO.authKey, varName: this.globalVarName };
		var url = CHZERO.webUrl + '/GetJibunJson.aspx';
		if (options) {
			OpenLayers.Util.extend(arr, options);
			if (options.cp)
				url = CHZERO.webUrl + '/GetJibunJsonPage.aspx';
		}
		var map = this;
		var req = new OpenLayers.Protocol.Script({
			url: url,
			params: arr,
			callback: function(res) {
				var data = res.data;
				(callback && typeof callback === 'function') ? callback(data) : (function() {
					if ('undefined' != typeof (data)) {
						var geojson_format = new OpenLayers.Format.GeoJSON();
						var collection = geojson_format.read(data);
						for (var i = 0; i < collection.length; i++) {
							var feat = collection[i];
							feat.geometry.transform(map.displayProjection, map.getProjectionObject());
							jibun = feat.data;
							var str = jibun.sido + ' ' + jibun.sigungu + '<BR/>';
							str += jibun.lawEmd;
							if (jibun.li && jibun.li.length > 0)
								str += ' ' + jibun.li;
							if (jibun.bunji && jibun.bunji.length > 0) {
								if (jibun.isSan)
									str += ' 산';
								str += ' ' + jibun.bunji;
								if (jibun.ho && jibun.ho.length > 0)
									str += '-' + jibun.ho;
								str += ' 번지';
							}
							if (jibun.roadName && jibun.roadName.length > 0) {
								str += '<BR/>' + jibun.roadName;
								if (jibun.roadNo1 && jibun.roadNo1.length > 0) {
									str += ' ' + jibun.roadNo1;
								}
								if (jibun.roadNo2 && jibun.roadNo2.length > 0) {
									str += ' - ' + jibun.roadNo2;
								}

							}
							var marker = map.addMarkerPopup(feat.geometry.x, feat.geometry.y, { popupContentHTML: str });
							marker.events.triggerEvent('mousedown', null);
						}
						var markerLayer = map.layerMap.MARKER;
						var ex = markerLayer.getDataExtent();
						if (ex != null) {
							map.zoomToExtent(ex);
						}
					}
				} ());
			}


		});
		req.read();
	},
	/**
	* 신주소 정보 찾기<br/>
	* 주소정보를 받아서 위치 및 지번 주소 정보를 가져온다.
	* <strong>data</strong> - <br/>
	* sido : {String}시도<br/>
	* sigungu : {String}시군구<br/>
	* roadName : {String}도로명<br/>
	* roadNo1 : {String}건물 주번호<br/>
	* roadNo2 : {String}건물 부번호<br/>
	* @method searchAddrRoad
	* @param {Object} data 도로 주소 정보
	* @param {Object} callback 콜백 함수
	*/
	searchAddrRoad: function(data, callback) {
		var str = JSON.stringify(data);
		var map = this;
		var req = new OpenLayers.Protocol.Script({
			url: CHZERO.webUrl + '/GetRoadAddrJson.aspx',
			params: { data: str, ver: CHZERO.version, authKey: CHZERO.authKey, varName: this.globalVarName },
			callback: function(res) {
				var data = res.data;
				(callback && typeof callback === 'function') ? callback(data) : (function() {
					if ('undefined' != typeof (data) && data && data.properties) {
						if (data.properties.status == 'error') {
							alert(data.properties.statusDetail);
						}
						else {
							var geojson_format = new OpenLayers.Format.GeoJSON();
							var collection = geojson_format.read(data);

							for (var i = 0; i < collection.length; i++) {
								var feat = collection[i];
								feat.geometry.transform(map.displayProjection, map.getProjectionObject());
								prop = feat.data;
								var str = prop.sido + ' ' + prop.sigungu + ' ' + prop.gu + '<BR/>';
								str += prop.roadName + ' ' + prop.roadNo1 + ' - ' + prop.roadNo2 + '<BR/>';
								str += prop.lawEmd;
								if (prop.li && prop.li.length > 0)
									str += ' ' + prop.li;
								if (prop.bunji && prop.bunji.length > 0) {
									if (prop.isSan)
										str += ' 산';
									str += ' ' + prop.bunji;
									if (prop.ho && prop.ho.length > 0)
										str += '-' + prop.ho;
									str += ' 번지';
								}
								/*obj.addMarker(null,feat.geometry.x,feat.geometry.y,str);*/
								var marker = map.addMarkerPopup(feat.geometry.x, feat.geometry.y, { popupContentHTML: str });
								marker.events.triggerEvent('mousedown', null);

							}
							var markerLayer = map.layerMap.MARKER;
							var ex = markerLayer.getDataExtent();
							if (ex != null) {
								map.zoomToExtent(ex);
								map.zoomOut();
							}
						}

					}
				} ());
			}
		});
		req.read();
	},
	/**
	* 마커 생성 후 지도에 그린다. 추가적으로 마커 클릭시 팝업 보여주는 등 설정 가능.<BR/>
	* <strong>option</strong> - <BR/>
	* icon : {OpenLayers.Icon} 마커아이콘. null이면 기본 아이콘으로 표시. 디폴트 null<BR/>
	* popupContentHTML : {String} 팝업내용. 빈문자열이나 널이면 팝업 생성 안함. 디폴트 빈문자열<BR/>
	* closeBox: {Boolean} 팝업닫기버튼 유무. 디폴트 false<BR/>
	* autoSize: {Boolean} 팝업 AUTO SIZE 유무. 디폴트 true<BR/>
	* popupSize: {OpenLayers.Size} 팝업Size. autoSize가 false 일때만 적용됨. 디폴트 null<BR/>
	* @method addMarkerPopup
	* @param {Float} lon 경도
	* @param {Float} lat 위도
	* @param {Object} options 옵션 
	* @return {OpenLayers.Marker} 마커
	*/
	addMarkerPopup: function(lon, lat, options) {
		var defaultOptions = { icon: null,
			popupContentHTML: '',
			closeBox: false,
			printMessage: null,
			autoSize: true,
			popupSize: null,
			overflow: 'hidden',
			popupType: OpenLayers.Popup.Anchored,
			panMapIfOutOfView: true
		};
		OpenLayers.Util.extend(defaultOptions, options);

		var layer = this.layerMap.MARKER;
		var ll = new OpenLayers.LonLat(lon, lat);
		var feature = new OpenLayers.Feature(layer, ll, defaultOptions);

		var marker = feature.createMarker();
		marker.feature = feature;
		layer.addMarker(marker);

		/*이미지저장시메세지*/
		if (defaultOptions.printMessage)
			marker.printMessage = defaultOptions.printMessage;

		if (options && options.popupContentHTML && options.popupContentHTML.length > 0) {
			feature.closeBox = defaultOptions.closeBox;
			/*feature.popupClass = OpenLayers.Class(OpenLayers.Popup.FramedCloud );*/
			feature.popupClass = OpenLayers.Class(defaultOptions.popupType, { 'autoSize': defaultOptions.autoSize, 'panMapIfOutOfView': defaultOptions.panMapIfOutOfView, 
				'size': defaultOptions.popupSize
			});
			var pp = feature.createPopup(defaultOptions.closeBox);
			pp.hide();

			var markerClick = function(evt) {
				if (this.popup != null && this.layer != null) {
					if (this.popup.visible()) {
						this.layer.map.removePopup(this.popup);
						this.popup.hide();
					}
					else {

						this.layer.map.addPopup(this.popup);
						/*$(this.popup.div).fadeIn('slow');*/
						this.popup.show();
					}


				}
				OpenLayers.Event.stop(evt);
			};
			marker.events.register('mousedown', feature, markerClick);
			marker.events.register('touchend', feature, markerClick);
		}
		/*this.map.addPopup(feature.createPopup(feature.closeBox));*/

		return marker;
	},

	/**
	* 지도를 이미지 파일로 저장한다.
	* @method save
	*/
	save: function() {
		var layer = this.layerMap.MARKER;
		var extent = this.getExtent();
		var size = this.getSize();
		var features = [];
		/*for (var i = 0; i < layer.markers.length; i++) {
		var marker = layer.markers[i];
		var pixel = this.getPixelFromLonLat(marker.lonlat);
		var feature = { type: 'Feature',
		geometry: { type: 'Point', coordinates: [marker.lonlat.lon, marker.lonlat.lat] },
		properties: { clientX: pixel.x, clientY: pixel.y,
		message: marker.printMessage ? marker.printMessage : ''
		}
		};
		features.push(feature);
		}*/
		if (features.length == 0) features = '';
		var featureCollection = { type: 'FeatureCollection', 'features': features
			, bbox: [extent.left, extent.bottom, extent.right, extent.top]
			, properties: { proj: this.getProjection(), layer: CHZERO.printLayer
						  , format: this.format
						  , tilesorigin: this.maxExtent.left + '%2C' + this.maxExtent.bottom
						  , width: size.w
						  , height: size.h
						  , wmsUrl: CHZERO.wmsUrl
			}
		};
		var str = JSON.stringify(featureCollection);


		this.form.method = 'POST';
		this.form.action = CHZERO.webUrl + '/WmsPrint.aspx';
		var inputs = this.form.getElementsByTagName('input');
		for (var i = 0; i < inputs.length; i++) {
			var input = inputs[i];
			if (input.name == 'geoJson') {
				input.value = str;
				break;
			}
		}
		/*$('input[name="geoJson"]', this.form).val(str);*/
		this.form.submit();

		/*location.href=CHZERO.webUrl+'/WmsPrint.aspx?geoJson='+encodeURI(str)+"&ver="+CHZERO.version+"&authKey="+CHZERO.authKey;*/
	},

	/*Measure 컨트롤생성하여 반환*/
	createMeasureControl: function(t, name) {
		con = new CHZERO.Control.ZeroMapMeasure(
                t, {
                	/*persist: true,*/
                	handlerOptions: {
                		layerOptions: { styleMap: this.measureStyleMap }
                	},
                	title: (name.length > 0 ? name : ''),
                	partialDelay: 50,
                	geodesic: true
                });

		/*con.events.on({
		measure: this.handleMeasurements
		measurepartial: this.handleMeasurementpartials
		});*/
		return con;
	},
	clearPopupMeasure: function() {
		if (this.eraser) {
			this.eraser.trigger();
		}
		this.destroyAllPopup();
	},

	/**
	* 지도에 모든 팝업을 제거하고 destroy 한다.
	* @method destroyAllPopup
	*/
	destroyAllPopup: function() {
		var pp = null;
		while (pp = this.popups.pop()) {
			this.destroyPopup(pp);
		}
	},

	/**
	* 지도에 팝업을 제거하고 해당 팝업을 destroy한다.
	* @method destroyPopup
	* @param {OpenLayers.Popup} popup 
	*/
	destroyPopup: function(popup) {
		OpenLayers.Util.removeItem(this.popups, popup);
		if (popup.div) {
			try { this.layerContainerDiv.removeChild(popup.div); }
			catch (e) { } /* Popups sometimes apparently get disconnected
			from the layerContainerDiv, and cause complaints.*/
		}
		popup.map = null;
		if (popup.feature != null) {
			if (popup.feature.popup) popup.feature.popup = null;
			popup.feature = null;
		}
		popup.destroy();
	},
	
	/**
	* 지도에 팝업을 모두 숨긴다.
	* @method hidePopup
	*/
	hidePopup: function() {
		var pp = null;
		for (var i = 0; i < this.popups.length; i++) {
			pp = this.popups[i];
			if (!pp.isMeasure)
				pp.hide();
		}
	}
});

Copyright © 2012 Yahoo! Inc. All rights reserved.