생태자연도 맵 서비스

생태자연도 맵 서비스

  • 생태자연도란 산ㆍ하천ㆍ내륙습지ㆍ호소(湖沼)ㆍ농지ㆍ도시 등에 대하여 자연환경을 생태적 가치, 자연성, 경관적 가치 등에 따라 등급화하여 자연환경보전법 제34조의 규정에 의하여 작성된 지도입니다.
  • 환경부 환경공간정보서비스에서 제공하는 WMS 서비스를 확인할 수 있습니다.
토지피복지도 맵 서비스
서비스명 레이어명
eco_2015_g 생태자연도

생태자연도 맵 서비스 예제

  • 아래의 소스코드와 같이 환경정보 맵 서비스를 레이어에 등록하면 지도를 표시할 수 있습니다.
                  	url : 'http://egisapp.me.go.kr/geoserver/gwc/service/wms?'
					, params : {
						'LAYERS' : 'EGIS:eco_2015_g',
						'TILED' : true,
						'SRS' : 'EPSG:3857'
			        }
                    
  • 다음의 html 코드는 "생태자연도"를 표시하는 예시입니다.
                    <!DOCTYPE html>
                    <html>
                    <head>
                        <meta charset="utf-8">
                        <meta content="IE=edge" http-equiv="X-UA-Compatible">
                        <title>환경공간정보서비스 - 생태자연도 예제</title>
                        <style type="text/css">
                          html, body, #map { margin: 0; padding: 0; width: 100%; height: 100%; }
                        </style>
                        <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/ol3/3.11.1/ol.min.css">
                        <script src="https://cdnjs.cloudflare.com/ajax/libs/ol3/3.11.1/ol.min.js"></script>
                    </head>
                    <body>
                    <div id="map"></div>	
                    <script type="text/javascript">
                      var map = new ol.Map({
                        target : 'map',
                        layers : [new ol.layer.Tile({
                          source : new ol.source.TileWMS({
                            url : 'http://egisapp.me.go.kr/geoserver/gwc/service/wms?'
							, params : {
								'LAYERS' : 'EGIS:eco_2015_g',
								'TILED' : true,
								'SRS' : 'EPSG:3857'
					        }
                          })
                        })],
                        view : new ol.View({
                          center : ol.proj.transform([ 127, 36.5 ], 'EPSG:4326', 'EPSG:3857')
                          ,zoom : 7
                          ,enableRotation : false
                        })
                      });
                    </script>
                    </body>
                    </html>