오지민 / HomePurchaseAgePrediction

Go to a project
Toggle navigation Toggle navigation pinning
서연진
457bb1c2 2 parents 113a7ac6 a6db0a6c

Fix conflict

Inline Side-by-side
Showing 2 changed files with 73 additions and 52 deletions
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html lang="en"> 2 <html lang="en">
3 - <head> 3 +
4 - <meta charset="UTR-8" /> 4 +<head>
5 - <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 5 + <meta charset="UTR-8" />
6 - <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 6 + <meta http-equiv="X-UA-Compatible" content="IE=edge" />
7 - <title>HomePurchaseAgePrediction</title> 7 + <meta name="viewport" content="width=device-width, initial-scale=1.0" />
8 - <link rel="stylesheet" href="css/style2.css" /> 8 + <title>HomePurchaseAgePrediction</title>
9 - <link rel="preconnect" href="https://fonts.gstatic.com" /> 9 + <link rel="stylesheet" href="css/style2.css" />
10 - <link 10 + <link rel="preconnect" href="https://fonts.gstatic.com" />
11 - href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;500;700;900&display=swap" 11 + <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;500;700;900&display=swap"
12 - rel="stylesheet" 12 + rel="stylesheet" />
13 - /> 13 +</head>
14 - </head> 14 +
15 - <body> 15 +<body>
16 - <nav> 16 + <nav>
17 - <h1 onClick="location.href='/'">Home Purchase Age Prediction</h1> 17 + <h1 onClick="location.href='/'">Home Purchase Age Prediction</h1>
18 - </nav> 18 + </nav>
19 - <main> 19 + <main>
20 - <div id="info"></div> 20 + <div id="info"></div>
21 - <div id="home_info"> 21 + <div id="home_info">
22 - <div id="map"></div> 22 + <div id="map"></div>
23 - <ul> 23 + <ul id="house_list">
24 - <div>LIST</div> 24 + <div>LIST</div>
25 - <li></i>아파트 목록을 가져옵니다.</li> 25 + </ul>
26 - <li></i>아파트 목록을 가져옵니다.</li> 26 + </div>
27 - <li></i>아파트 목록을 가져옵니다.</li> 27 + </main>
28 - <li></i>아파트 목록을 가져옵니다.</li> 28 + <script type="text/javascript"
29 - <li></i>아파트 목록을 가져옵니다.</li> 29 + src="//dapi.kakao.com/v2/maps/sdk.js?appkey=17cbb7795b615d8f1f0595f972e26c0f&libraries=services,clusterer,drawing"></script>
30 - </ul> 30 + <script type="text/javascript" src="../js/next_page.js"></script>
31 - </div> 31 +</body>
32 - </main> 32 +
33 - <script 33 +</html>
34 - type="text/javascript"
35 - src="//dapi.kakao.com/v2/maps/sdk.js?appkey=17cbb7795b615d8f1f0595f972e26c0f&libraries=services,clusterer,drawing"
36 - ></script>
37 - <script type="text/javascript" src="../js/next_page.js"></script>
38 - </body>
39 -</html>
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -13,7 +13,7 @@ function resizeMap() { ...@@ -13,7 +13,7 @@ function resizeMap() {
13 Container.style.width = "400px"; 13 Container.style.width = "400px";
14 Container.style.height = "300px"; 14 Container.style.height = "300px";
15 } 15 }
16 - 16 +
17 function relayout() { 17 function relayout() {
18 map.relayout(); 18 map.relayout();
19 } 19 }
...@@ -81,21 +81,48 @@ function displayMarker(Position) { ...@@ -81,21 +81,48 @@ function displayMarker(Position) {
81 }); 81 });
82 82
83 map.setCenter(Position); 83 map.setCenter(Position);
84 - function getParameterByName(name, url = window.location.href) { 84 +}
85 - name = name.replace(/[\[\]]/g, "\\$&"); 85 +
86 - var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"), 86 +function getParameterByName(name, url = window.location.href) {
87 - results = regex.exec(url); 87 + name = name.replace(/[\[\]]/g, "\\$&");
88 - if (!results) return null; 88 + var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
89 - if (!results[2]) return ""; 89 + results = regex.exec(url);
90 - return decodeURIComponent(results[2].replace(/\+/g, " ")); 90 + if (!results) return null;
91 + if (!results[2]) return "";
92 + return decodeURIComponent(results[2].replace(/\+/g, " "));
93 +}
94 +
95 +//가격리스트로 year계산
96 +var priceList = [2000, 3000, 4000, 5000]; //임시로 넣어뒀습니다.
97 +function yearCalc() {
98 + var sum = 0;
99 + for (var i = 0; i < priceList.length; i++) {
100 + sum = sum + priceList[i];
91 } 101 }
102 + var meanPrice = sum / priceList.length;
103 + var saveInyear = (Number(salary) - Number(expenditure)) * 12;
104 + return Math.ceil(meanPrice / saveInyear);
105 +}
92 106
93 - //다음 페이지에서 입력값 받아오기 107 +//다음 페이지에서 입력값 받아오기
94 - var salary = getParameterByName("salary"); 108 +var salary = getParameterByName("salary");
95 - var expenditure = getParameterByName("expenditure"); 109 +var expenditure = getParameterByName("expenditure");
96 - var year = "3"; //값 받아오기 전 기본값으로 설정 110 +var year = yearCalc();
97 - var div = document.getElementById("info"); 111 +var div = document.getElementById("info");
98 - div.innerText = `${salary}만원의 월급과 ${expenditure}만원의 지출을 유지하면 당신은 ${year}년 후 아래의 집을 구매할 수 있습니다.`;
99 112
100 - connection.end(); 113 +//20년을 초과한 결과값이 나올 때 20 + α 로 표시합니다.
114 +if (year > 20) {
115 + year = "20 + α ";
101 } 116 }
117 +div.innerText = `${salary}만원의 월급과 ${expenditure}만원의 지출을 유지하면 당신은 ${year}년 후 아래의 집을 구매할 수 있습니다.`;
118 +
119 +//주소 받아오기
120 +var dataFromServer = ["xx동 xx", "xx", "00동 00"]; //임시로 넣어뒀습니다.
121 +
122 +//next page li 요소 추가
123 +for (var i = 0; i < dataFromServer.length; i++) {
124 + const li = document.createElement("li");
125 + const textNode = document.createTextNode(dataFromServer[i]);
126 + li.appendChild(textNode);
127 + document.getElementById("house_list").appendChild(li);
128 +}
...\ No newline at end of file ...\ No newline at end of file
......