Showing
4 changed files
with
74 additions
and
32 deletions
1 | 1 | ||
2 | +## Topic | ||
3 | +> 코로나 19 예방접종 의료기관 조회 웹서비스를 제공하는 프로젝트입니다. | ||
2 | 4 | ||
3 | -~~~ | 5 | +## Member |
4 | -# integrated#1의 branch를 clone해오기 | 6 | +| 김서연 | 허정용 | |
5 | -git clone -b integrated#1 --single-branch http://khuhub.khu.ac.kr/2018103585/Corona_Vaccination_Medical_Institution.git | 7 | +| :----: | :----: | |
6 | -cd Corona_Vaccination_Medical_Institution | 8 | +| [@ksy991018](https://github.com/ksy991018) | [@JeongYougHeo](https://github.com/JeongYougHeo) | |
7 | - | ||
8 | - | ||
9 | -# 본인 이름으로 각자 branch 생성 후 올리기 | ||
10 | -git checkout -b integrated#1_이름 | ||
11 | -git add . | ||
12 | -git commit -m "커밋메시지" | ||
13 | -git push origin integrated#1_이름 | ||
14 | -~~~ | ||
15 | 9 | ... | ... |
... | @@ -8,6 +8,8 @@ app.locals.pretty=true; | ... | @@ -8,6 +8,8 @@ app.locals.pretty=true; |
8 | app.set('views','./views') | 8 | app.set('views','./views') |
9 | app.set('view engine','pug'); | 9 | app.set('view engine','pug'); |
10 | app.use(express.static('public')); | 10 | app.use(express.static('public')); |
11 | +var http = require('http'); | ||
12 | +var fs = require('fs'); | ||
11 | 13 | ||
12 | //?page=페이지번호&?perPage=페이지당 데이터수 | 14 | //?page=페이지번호&?perPage=페이지당 데이터수 |
13 | const $base_url = `https://api.odcloud.kr/api/apnmOrg/v1/list`; | 15 | const $base_url = `https://api.odcloud.kr/api/apnmOrg/v1/list`; |
... | @@ -27,9 +29,7 @@ app.post('/',function(req,res,next){ | ... | @@ -27,9 +29,7 @@ app.post('/',function(req,res,next){ |
27 | 29 | ||
28 | //data부분만 추출 | 30 | //data부분만 추출 |
29 | var obj = JSON.parse(body).data; | 31 | var obj = JSON.parse(body).data; |
30 | - | ||
31 | // console.log(obj); | 32 | // console.log(obj); |
32 | - | ||
33 | //검색한 지역 포함한 모든 data 담기 | 33 | //검색한 지역 포함한 모든 data 담기 |
34 | let searchList = obj.filter(searchList => { | 34 | let searchList = obj.filter(searchList => { |
35 | return searchList.orgZipaddr.includes(searchWord); | 35 | return searchList.orgZipaddr.includes(searchWord); |
... | @@ -38,19 +38,27 @@ app.post('/',function(req,res,next){ | ... | @@ -38,19 +38,27 @@ app.post('/',function(req,res,next){ |
38 | // console.log(searchList); | 38 | // console.log(searchList); |
39 | //result라는 변수에 담아 결과 보내기 | 39 | //result라는 변수에 담아 결과 보내기 |
40 | res.render('main', {result:searchList }); | 40 | res.render('main', {result:searchList }); |
41 | + | ||
41 | }) | 42 | }) |
42 | 43 | ||
43 | }) | 44 | }) |
44 | 45 | ||
46 | +app.get('/',function(req,res){ | ||
47 | + res.writeHead(200, {'Content-Type': 'text/html'}); | ||
48 | + fs.readFile('./map/kakaomap.html', null, function(err,data){ | ||
49 | + if(err){ | ||
50 | + res.writeHead(404); | ||
51 | + res.write('error'); | ||
52 | + } | ||
53 | + else{ | ||
54 | + console.log('complete!'); | ||
55 | + res.write(data); | ||
56 | + } | ||
57 | + res.end(); | ||
58 | + }); | ||
59 | +}) | ||
45 | 60 | ||
46 | app.listen(3000,function(){ | 61 | app.listen(3000,function(){ |
47 | console.log('Connected 3000 port!'); | 62 | console.log('Connected 3000 port!'); |
48 | }); | 63 | }); |
49 | 64 | ||
50 | -app.get('/',function(req,res){ | ||
51 | - res.render('main'); | ||
52 | -}) | ||
53 | - | ||
54 | -app.get('/map',function(req,res){ | ||
55 | - res.resnder('./map/map.html'); | ||
56 | -}) | ... | ... |
... | @@ -6,6 +6,13 @@ | ... | @@ -6,6 +6,13 @@ |
6 | 6 | ||
7 | </head> | 7 | </head> |
8 | <body> | 8 | <body> |
9 | + <h1>COVID-19 의료기관 검색하기</h1> | ||
10 | + <form action="/" method="post"> | ||
11 | + <p> | ||
12 | + <input type="text" name="region" placeholder="서울시"/> | ||
13 | + <input type="submit"/> | ||
14 | + </p> | ||
15 | + </form> | ||
9 | <div id="map" style="width:700px;height:400px;"></div> | 16 | <div id="map" style="width:700px;height:400px;"></div> |
10 | 17 | ||
11 | <script type="text/javascript" src="https://dapi.kakao.com/v2/maps/sdk.js?appkey=35fccf4b4e2a3179187346f26ed3f988"></script> | 18 | <script type="text/javascript" src="https://dapi.kakao.com/v2/maps/sdk.js?appkey=35fccf4b4e2a3179187346f26ed3f988"></script> | ... | ... |
... | @@ -6,23 +6,56 @@ | ... | @@ -6,23 +6,56 @@ |
6 | 6 | ||
7 | </head> | 7 | </head> |
8 | <body> | 8 | <body> |
9 | + | ||
10 | + | ||
11 | + <h1>COVID-19 의료기관 검색하기</h1> | ||
12 | + <form action="/" method="post"> | ||
13 | + <p> | ||
14 | + <input type="text" name="region" placeholder="서울시"/> | ||
15 | + <input type="submit"/> | ||
16 | + </p> | ||
17 | + </form> | ||
18 | + | ||
9 | <div id="map" style="width: 700px;height:400px;"></div> | 19 | <div id="map" style="width: 700px;height:400px;"></div> |
10 | -<script type="text/javascript" src="https://dapi.kakao.com/v2/maps/sdk.js?appkey=35fccf4b4e2a3179187346f26ed3f988&libraries=services"></script> | 20 | + <script type="text/javascript" src="https://dapi.kakao.com/v2/maps/sdk.js?appkey=35fccf4b4e2a3179187346f26ed3f988&libraries=services"></script> |
11 | -<script> | 21 | + <script> |
12 | -var mapContainer = document.getElementById('map'), // 지도를 표시할 div | 22 | + var mapContainer = document.getElementById('map'), // 지도를 표시할 div |
13 | mapOption = { | 23 | mapOption = { |
14 | center: new kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표 | 24 | center: new kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표 |
15 | level: 3 // 지도의 확대 레벨 | 25 | level: 3 // 지도의 확대 레벨 |
16 | }; | 26 | }; |
17 | 27 | ||
18 | -// 지도를 생성합니다 | 28 | + // 지도를 생성합니다 |
19 | -var map = new kakao.maps.Map(mapContainer, mapOption); | 29 | + var map = new kakao.maps.Map(mapContainer, mapOption); |
30 | + | ||
31 | + // 주소-좌표 변환 객체를 생성합니다 | ||
32 | + var geocoder = new kakao.maps.services.Geocoder(); | ||
33 | + | ||
34 | + // 주소로 좌표를 검색합니다 | ||
35 | + geocoder.addressSearch('서울특별시 강동구 올림픽로 779', function(result, status) { | ||
36 | + | ||
37 | + // 정상적으로 검색이 완료됐으면 | ||
38 | + if (status === kakao.maps.services.Status.OK) { | ||
39 | + | ||
40 | + var coords = new kakao.maps.LatLng(result[0].y, result[0].x); | ||
41 | + | ||
42 | + // 결과값으로 받은 위치를 마커로 표시합니다 | ||
43 | + var marker = new kakao.maps.Marker({ | ||
44 | + map: map, | ||
45 | + position: coords | ||
46 | + }); | ||
20 | 47 | ||
21 | -// 주소-좌표 변환 객체를 생성합니다 | 48 | + // 인포윈도우로 장소에 대한 설명을 표시합니다 |
22 | -var geocoder = new kakao.maps.services.Geocoder(); | 49 | + var infowindow = new kakao.maps.InfoWindow({ |
50 | + content: '<div style="width:150px;text-align:center;padding:6px 0;">기관명</div>' | ||
51 | + }); | ||
52 | + infowindow.open(map, marker); | ||
23 | 53 | ||
24 | -// 주소로 좌표를 검색합니다 | 54 | + // 지도의 중심을 결과값으로 받은 위치로 이동시킵니다 |
25 | -geocoder.addressSearch('경희대로26', function(result, status) { | 55 | + map.setCenter(coords); |
56 | + } | ||
57 | + }); | ||
58 | + geocoder.addressSearch('서울특별시 동대문구 회기로 173', function(result, status) { | ||
26 | 59 | ||
27 | // 정상적으로 검색이 완료됐으면 | 60 | // 정상적으로 검색이 완료됐으면 |
28 | if (status === kakao.maps.services.Status.OK) { | 61 | if (status === kakao.maps.services.Status.OK) { |
... | @@ -44,7 +77,7 @@ geocoder.addressSearch('경희대로26', function(result, status) { | ... | @@ -44,7 +77,7 @@ geocoder.addressSearch('경희대로26', function(result, status) { |
44 | // 지도의 중심을 결과값으로 받은 위치로 이동시킵니다 | 77 | // 지도의 중심을 결과값으로 받은 위치로 이동시킵니다 |
45 | map.setCenter(coords); | 78 | map.setCenter(coords); |
46 | } | 79 | } |
47 | -}); | 80 | + }); |
48 | -</script> | 81 | + </script> |
49 | </body> | 82 | </body> |
50 | </html> | 83 | </html> |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
-
Please register or login to post a comment