# Leaflet TileMapService 예시
- 홈페이지 : http://leafletjs.com/
- 튜토리얼 : http://leafletjs.com/examples.html
- Docs : http://leafletjs.com/reference-1.2.0.html
- 다운로드 : http://leafletjs.com/download.html
## Leaflet 다운로드
[다운로드 페이지](http://leafletjs.com/download.html)에서 파일을 내려받습니다.
### HTML head 추가
다운로드 받은 파일을 추가 합니다.
```html
```
JSTL를 사용중이므로 ``와 같이 사용하였습니다.
## 지도 영역 설정
HTML 코드에서 지도영역을 설정합니다.
```html
```
## 지도 생성
```javascript
var map; // 화면 표출 맵
// 지도 생성
map = L.map('mapArea', {});
```
## 타일맵 설정
```javascript
var geoserver = "10x.11x.10x.11x";
var baseOption = {
minZoom : 15,
maxZoom : 19
}
var base2dUrl = 'http://' + geoserver + ':9500/geoserver/www/tms/2d/base/{z}/{x}/{y}.png';
var base2d = L.tileLayer(base2dUrl, baseOption);
```
타일맵 파일들을 서버에 복사합니다.
타일맵은 `{z}/{x}/{y}` 으로 폴더경로로 나뉘어 집니다.
- z : Zoom
- x : Longitude
- y : Latitude
타일맵 파일은 웹 서버에 등록해 놓았습니다.
## 타일맵을 지도에 등록
```javascript
base2d.addTo(map);
```
## 전체 소스
```html