Showing
1 changed file
with
26 additions
and
64 deletions
1 | -//### csv 파일에서 정보를 읽어오고, 2차원 배열화 | ||
2 | 1 | ||
3 | -const parse = require("csv-parse/lib/sync"); | ||
4 | -const fs = require("fs"); | ||
5 | - | ||
6 | -const csv = fs.readFileSync("todolistdata.csv"); | ||
7 | -console.log(csv.toString()); | ||
8 | -//parse 메서드 -> 2차원배열화 | ||
9 | -const records = parse(csv.toString()); | ||
10 | -const addr = [] | ||
11 | - | ||
12 | -for (var i = 0; i < records.length; i++){ | ||
13 | - for(var j = 0; j < records[i].length; j++){ | ||
14 | - addr.push(records[i][4]); | ||
15 | - } | ||
16 | - console.log(addr); | ||
17 | - | ||
18 | -} | ||
19 | - | ||
20 | - | ||
21 | - | ||
22 | -//------------------------------------------------------------------ | ||
23 | -//###주소로 장소 검색하기### | ||
24 | - | ||
25 | - | ||
26 | - | ||
27 | -var mapContainer = document.getElementById('map'), // 지도를 표시할 div | ||
28 | - mapOption = { | ||
29 | - center: new kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표 | ||
30 | - level: 3 // 지도의 확대 레벨 | ||
31 | - }; | ||
32 | - | ||
33 | -// 지도를 생성합니다 | ||
34 | -var map = new kakao.maps.Map(mapContainer, mapOption); | ||
35 | - | ||
36 | -// 주소-좌표 변환 객체를 생성합니다 | ||
37 | -var geocoder = new kakao.maps.services.Geocoder(); | ||
38 | - | ||
39 | -// 찾을 주소 | ||
40 | -var searchAddress; | ||
41 | - | ||
42 | -// 주소로 좌표를 검색합니다 | ||
43 | -geocoder.addressSearch(searchAddress, function(result, status) { | ||
44 | - | ||
45 | - // 정상적으로 검색이 완료됐으면 | ||
46 | - if (status === kakao.maps.services.Status.OK) { | ||
47 | - | ||
48 | - var coords = new kakao.maps.LatLng(result[0].y, result[0].x); | ||
49 | - | ||
50 | - // 결과값으로 받은 위치를 마커로 표시합니다 | ||
51 | - var marker = new kakao.maps.Marker({ | ||
52 | - map: map, | ||
53 | - position: coords | ||
54 | - }); | ||
55 | - | ||
56 | - // 인포윈도우로 장소에 대한 설명을 표시합니다 | ||
57 | - var infowindow = new kakao.maps.InfoWindow({ | ||
58 | - content: '<div style="width:150px;text-align:center;padding:6px 0;">목적지</div>' | ||
59 | - }); | ||
60 | - infowindow.open(map, marker); | ||
61 | - | ||
62 | - // 지도의 중심을 결과값으로 받은 위치로 이동시킵니다 | ||
63 | - map.setCenter(coords); | ||
64 | - } | ||
65 | -}); | ||
... | \ No newline at end of file | ... | \ No newline at end of file |
2 | +var locationx; | ||
3 | +var locationy; | ||
4 | +var location_name; | ||
5 | + | ||
6 | + | ||
7 | +// 이미지 지도에 표시할 마커입니다 | ||
8 | +// 이미지 지도에 표시할 마커를 아래와 같이 배열로 넣어주면 여러개의 마커를 표시할 수 있습니다 | ||
9 | +var markers = [ | ||
10 | + { | ||
11 | + position: new kakao.maps.LatLng(locationx, locationy) | ||
12 | + }, | ||
13 | + { | ||
14 | + position: new kakao.maps.LatLng(locationx, locationy), | ||
15 | + text: '추천할 장소 : ' + location_name // text 옵션을 설정하면 마커 위에 텍스트를 함께 표시할 수 있습니다 | ||
16 | + } | ||
17 | +]; | ||
18 | + | ||
19 | +var staticMapContainer = document.getElementById('staticMap'), // 이미지 지도를 표시할 div | ||
20 | + staticMapOption = { | ||
21 | + center: new kakao.maps.LatLng(locationx, locationy), // 이미지 지도의 중심좌표 | ||
22 | + level: 3, // 이미지 지도의 확대 레벨 | ||
23 | + marker: markers // 이미지 지도에 표시할 마커 | ||
24 | + }; | ||
25 | + | ||
26 | +// 이미지 지도를 생성합니다 | ||
27 | +var staticMap = new kakao.maps.StaticMap(staticMapContainer, staticMapOption); | ||
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
-
Please register or login to post a comment