2020-1-capstone-design2 / 2015101793

Go to a project
Toggle navigation Toggle navigation pinning
양선아
f816c299 1 parent 1f9fb652

5/25 update

Inline Side-by-side
Showing 8 changed files with 310 additions and 97 deletions
1 #무시할 파일 확장자 1 #무시할 파일 확장자
2 *.csv 2 *.csv
3 +C:/Users/tjsdk/Desktop/5학년 1학기/캡스톤디자인2/datamapdata/CTPRVN_201905/TL_SCCO_STPRVN.dbf
4 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\CTPRVN_201905\TL_SCCO_STPRVN.prj
5 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\CTPRVN_201905\TL_SCCO_STPRVN.shp
6 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\CTPRVN_201905\TL_SCCO_STPRVN.shx
7 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\CTPRVN_201905\TL_SCCO_STPRVN_convert.dbf
8 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\CTPRVN_201905\TL_SCCO_STPRVN_convert.prj
9 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\CTPRVN_201905\TL_SCCO_STPRVN_convert.shp
10 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\CTPRVN_201905\TL_SCCO_STPRVN_convert.shx
11 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\SIG_201905\sig.json
12 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\SIG_201905/TL_SCCO_SIG.dbf
13 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\SIG_201905/TL_SCCO_SIG.prj
14 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\SIG_201905/TL_SCCO_SIG.shp
15 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\SIG_201905/TL_SCCO_SIG.shx
16 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\SIG_201905/TL_SCCO_SIG_convert.dbf
17 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\SIG_201905/TL_SCCO_SIG_convert.prj
18 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\SIG_201905/TL_SCCO_SIG_convert.shp
19 +C:\Users\tjsdk\Desktop\5학년 1학기\캡스톤디자인2\data\mapdata\SIG_201905/TL_SCCO_SIG_convert.shx
3 20
4 21
5 # Created by https://www.gitignore.io/api/django 22 # Created by https://www.gitignore.io/api/django
......
1 +<!DOCTYPE html>
2 +<html lang="kr">
3 + <head>
4 + <title>RF-Project</title>
5 + <!--BOOTSTRAP 사용 부분-->
6 + <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
7 + <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
8 + <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
9 + <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
10 +
11 + </head>
12 +
13 + <body>
14 + <h1><a href="http://127.0.0.1:8000/market_analysis/maplist">Statistics on Return Farm Project</a></h1>
15 + <br>
16 + <h3>농산물 시장 유통에 대한 통계분석 입니다.</h3>
17 + <br>
18 +
19 + <ul class="nav justify-content-center">
20 + <li class="nav-item">
21 + <a class="nav-link active" href="http://127.0.0.1:8000/market_analysis/market">Market</a>
22 + </li>
23 + <li class="nav-item">
24 + <a class="nav-link" href="http://127.0.0.1:8000/market_analysis/population">Population</a>
25 + </li>
26 + <li class="nav-item">
27 + <a class="nav-link" href="http://127.0.0.1:8000/market_analysis/returnfarm">Return Farm</a>
28 + </li>
29 + </ul>
30 +
31 + </div>
32 + </body>
33 +</html>
...\ No newline at end of file ...\ No newline at end of file
1 -<html>
2 - <head>
3 - <!-- link에 들어가 있는건 지도 데이터를 위한 css 파일 -->
4 - <!-- script에 들어가 있는건 지도 데이터를 위한 js 파일 -->
5 - <!-- 직접 다운받아 넣을 수도 있는데 우선은 그냥 웹에서 불러올 수 있도록 해놨다. -->
6 - <link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css" />
7 - <script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"></script>
8 - <!--css 내용 여기에 direct로 넣었다-->
9 - <style>
10 - #mapbase {position:relative; width:50%; height:0;padding-bottom:60%; }
11 - </style>
12 - </head>
13 -
14 - <body>
15 -
16 - {%for data in exportdata%}
17 - <p>{{data.cntr}}</p>
18 - {%endfor%}
19 -
20 - <div id="mapbase"></div>
21 -
22 - <script type="text/javascript">
23 - // map 객체 생성 map안에 넣어주는건 div id
24 - // 위도, 경도, zoom 수준
25 - var map = L.map('mapbase').setView([36.5205243,128.0540569], 7);
26 - // tilelayer를 씌우는 작업 OSM을 사용했음
27 - L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
28 - attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
29 - maxZoom: 10,
30 - id: 'mapbox/light-v9',
31 - tileSize: 512,
32 - zoomOffset:-1,
33 - accessToken: 'pk.eyJ1IjoidGpzZGszMTA1IiwiYSI6ImNrYWM5bXljZzB1N28ycnA5bTVsNHZsbnkifQ.W3-irWof5WMR8BcfBR4Ftw'
34 - }).addTo(map);
35 -
36 - // mapdata 가져오는 부분
37 - var statesData = "{{maps}}".replace(/&quot;/g,"\"");
38 -
39 - statesData = JSON.parse(statesData);
40 -
41 - // replace 쓰는 방법 : (바꾸기 전 문자, 바꾸고 난 후 문자)
42 - // density data 추가하는 부분
43 - var densitydata = "{{exportdata}}".replace(/&#x27;/g,"\"");
44 - densitydata = densitydata.slice(13,-4);
45 - densitydata = JSON.parse(densitydata);
46 -
47 - document.write(densitydata);
48 -
49 - for(var i =0; i<densitydata.length; i++)
50 - {
51 - for(var j=0; j<statesData.features.length; j++)
52 - {
53 - if (statesData.features[j]['properties']['SIG_KOR_NM'].indexOf(densitydata[i]['cntr'])==0)
54 - {
55 - statesData.features[j]['properties']['density']=densitydata[i]['count'];
56 - break;
57 - }
58 - }
59 - };
60 -
61 - function getColor(d) {
62 - return d > 30 ? '#800026' :
63 - d > 25 ? '#BD0026' :
64 - d > 20 ? '#E31A1C' :
65 - d > 15 ? '#FC4E2A' :
66 - d > 10 ? '#FD8D3C' :
67 - d > 5 ? '#FEB24C' :
68 - d > 0 ? '#FED976' :
69 - '#FFEDA0';
70 - }
71 - function style(feature) {
72 - return {
73 - fillColor: getColor(feature.properties.density),
74 - weight: 2,
75 - opacity: 1,
76 - color: 'white',
77 - dashArray: '3',
78 - fillOpacity: 0.7
79 - };
80 - }
81 - L.geoJson(statesData, {style: style}).addTo(map);
82 - </script>
83 - </body>
84 -</html>
...\ No newline at end of file ...\ No newline at end of file
1 +<h1>market</h1>
...\ No newline at end of file ...\ No newline at end of file
1 +<h1>population</h1>
...\ No newline at end of file ...\ No newline at end of file
1 +<!DOCTYPE html>
2 +<html lang="kr">
3 + <head>
4 + <title>RF-Project</title>
5 + <!-- link에 들어가 있는건 지도 데이터를 위한 css 파일 -->
6 + <!-- script에 들어가 있는건 지도 데이터를 위한 js 파일 -->
7 + <!-- 직접 다운받아 넣을 수도 있는데 우선은 그냥 웹에서 불러올 수 있도록 해놨다. -->
8 + <link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css" />
9 + <script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"></script>
10 + <!--css 내용 여기에 direct로 넣었다-->
11 + <style>
12 + #mapbase {position:relative; width:40%; height:0; padding-bottom:40%; }
13 + .info {
14 + padding: 6px 8px;
15 + font: 14px/16px Arial, Helvetica, sans-serif;
16 + background: white;
17 + background: rgba(255,255,255,0.8);
18 + box-shadow: 0 0 15px rgba(0,0,0,0.2);
19 + border-radius: 5px;
20 + }
21 + .info h4 {
22 + margin: 0 0 5px;
23 + color: #777;
24 + }
25 + .legend {
26 + line-height: 18px;
27 + color: #555;
28 + }
29 + .legend i {
30 + width: 18px;
31 + height: 18px;
32 + float: left;
33 + margin-right: 8px;
34 + opacity: 0.7;
35 + }
36 + </style>
37 +
38 + <!--BOOTSTRAP 사용 부분-->
39 + <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
40 + <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
41 + <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
42 + <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
43 +
44 + </head>
45 +
46 + <body>
47 + <h1><a href="http://127.0.0.1:8000/market_analysis/maplist">Statistics on Return Farm Project</a></h1>
48 + <br>
49 + <h3>농산물 시장 유통에 대한 통계분석 입니다.</h3>
50 + <br>
51 +
52 + <ul class="nav justify-content-center">
53 + <li class="nav-item">
54 + <a class="nav-link active" href="http://127.0.0.1:8000/market_analysis/market">Market</a>
55 + </li>
56 + <li class="nav-item">
57 + <a class="nav-link" href="http://127.0.0.1:8000/market_analysis/population">Population</a>
58 + </li>
59 + <li class="nav-item">
60 + <a class="nav-link" href="http://127.0.0.1:8000/market_analysis/returnfarm">Return Farm</a>
61 + </li>
62 + </ul>
63 +<!--return farm 단독 부분-->
64 + <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
65 + <li class="nav-item" role="presentation">
66 + <a class="nav-link" id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-selected="true">지역</a>
67 + </li>
68 + <li class="nav-item dropdown">
69 + <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">내용</a>
70 + <div class="dropdown-menu">
71 + <a class="dropdown-item" href="#">교육</a>
72 + <a class="dropdown-item" href="#">지원정책</a>
73 + </div>
74 + </li>
75 + <li class="nav-item" role="presentation">
76 + <a class="nav-link" id="pills-contact-tab" data-toggle="pill" href="#pills-contact" role="tab" aria-selected="false">Return Farm</a>
77 + </li>
78 + </ul>
79 + <div class="tab-content" id="pills-tabContent">
80 + <div class="tab-pane fade" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab">Hello</div>
81 + <div class="tab-pane fade" id="pills-profile" role="tabpanel" aria-labelledby="pills-profile-tab">Bonjour</div>
82 + <div class="tab-pane fade" id="pills-contact" role="tabpanel" aria-labelledby="pills-contact-tab">안녕하세요</div>
83 + </div>
84 +
85 + <div id="mapbase"></div>
86 + <script type="text/javascript">
87 + ///////////// 지도 생성해주는 부분임 //////////////
88 +
89 + // map 객체 생성 map안에 넣어주는건 div id
90 + // 위도, 경도, zoom 수준
91 + var map = L.map('mapbase', {zoomDelta: 0.25, zoomSnap: 0}).setView([36.5205243,128.0540569], 7);
92 + // tilelayer를 씌우는 작업 OSM을 사용했음
93 + L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
94 + attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
95 + maxZoom: 10,
96 + id: 'mapbox/light-v9',
97 + tileSize: 512,
98 + zoomOffset:-1,
99 + accessToken: 'pk.eyJ1IjoidGpzZGszMTA1IiwiYSI6ImNrYWM5bXljZzB1N28ycnA5bTVsNHZsbnkifQ.W3-irWof5WMR8BcfBR4Ftw'
100 + }).addTo(map);
101 +
102 + // mapdata 가져오는 부분
103 + // replace 쓰는 방법 : (바꾸기 전 문자, 바꾸고 난 후 문자)
104 + var statesdata = "{{maps}}".replace(/&quot;/g,"\"");
105 + statesdata = JSON.parse(statesdata);
106 +
107 + function getColor(d) {
108 + return d > 30 ? '#800026' :
109 + d > 25 ? '#BD0026' :
110 + d > 20 ? '#E31A1C' :
111 + d > 15 ? '#FC4E2A' :
112 + d > 10 ? '#FD8D3C' :
113 + d > 5 ? '#FEB24C' :
114 + d > 0 ? '#FED976' :
115 + '#FFEDA0';
116 + }
117 + function style(feature) {
118 + return {
119 + fillColor: getColor(feature.properties.density),
120 + weight: 2,
121 + opacity: 1,
122 + color: 'white',
123 + dashArray: '3',
124 + fillOpacity: 0.7
125 + };
126 + }
127 + let key = Object.keys(statesdata.features[1].properties);
128 + </script>
129 +
130 + {% for data in exportdata %}
131 + <script>
132 + // density data 추가하는 부분
133 + for(var j=0; j<statesdata.features.length; j++)
134 + {
135 + if (statesdata.features[j]['properties'][key[2]]=="{{data.city}}")
136 + {
137 + statesdata.features[j]['properties']['density']="{{data.count}}";
138 + break;
139 + }
140 + }
141 + </script>
142 + {% endfor %}
143 +
144 + <script>
145 + var geojson;
146 + L.geoJson(statesdata, {style: style}).addTo(map);
147 + // mouseover event listener
148 + function highlightFeature(e) {
149 + var layer = e.target;
150 + layer.setStyle({
151 + weight: 5,
152 + color: '#666',
153 + dashArray: '',
154 + fillOpacity: 0.7
155 + });
156 +
157 + if (!L.Browser.ie && !L.Browser.opera && !L.Browser.edge) {
158 + layer.bringToFront();
159 + }
160 + info.update(layer.feature.properties);
161 + }
162 + // mouseout define
163 + function resetHighlight(e) {
164 + geojson.resetStyle(e.target);
165 + info.update();
166 + }
167 + function zoomToFeature(e) {
168 + map.fitBounds(e.target.getBounds());
169 + }
170 + function onEachFeature(feature, layer) {
171 + layer.on({
172 + mouseover: highlightFeature,
173 + mouseout: resetHighlight,
174 + click: zoomToFeature
175 + });
176 + }
177 +
178 + geojson = L.geoJson(statesdata, {
179 + style: style,
180 + onEachFeature: onEachFeature
181 + }).addTo(map);
182 +
183 +
184 + </script>
185 + <!--information, legend, zoom 넣는 부분-->
186 + <div class="info"></div>
187 + <script>
188 + var info = L.control();
189 +
190 + info.onAdd = function (map) {
191 + this._div = L.DomUtil.create('div', 'info'); // create a div with a class "info"
192 + this.update();
193 + return this._div;
194 + };
195 +
196 + // method that we will use to update the control based on feature properties passed
197 + info.update = function (props) {
198 + this._div.innerHTML = '<h4>Korea Return Farm Density</h4>' + (props ?
199 + '<b>' + props[key[2]] + '</b><br />' + props.density + ' 개의 교육 예정'
200 + : 'Hover over a state');
201 + };
202 +
203 + info.addTo(map);
204 +
205 + var legend = L.control({position: 'bottomright'});
206 +
207 + legend.onAdd = function (map) {
208 +
209 + var div = L.DomUtil.create('div', 'info legend'),
210 + grades = [0, 5, 10, 15, 20, 25, 30],
211 + labels = [],
212 + from, to;
213 +
214 + // loop through our density intervals and generate a label with a colored square for each interval
215 + for (var i = 0; i < grades.length; i++) {
216 + from = grades[i];
217 + to = grades[i+1];
218 + labels.push(
219 + '<i style="background: '+ getColor(from + 1) + '"></i> ' + from + (to ? '&ndash;' + to :'+'));
220 + }
221 + div.innerHTML = labels.join('<br>');
222 + return div;
223 + };
224 + legend.addTo(map);
225 +
226 +
227 + </script>
228 + </body>
229 +</html>
...\ No newline at end of file ...\ No newline at end of file
...@@ -2,5 +2,8 @@ from django.conf.urls import url ...@@ -2,5 +2,8 @@ from django.conf.urls import url
2 from . import views 2 from . import views
3 3
4 urlpatterns = [ 4 urlpatterns = [
5 - url('maplist', views.maplist), 5 + url('returnfarm/<int:maptype>', views.returnfarm),
6 + url('population', views.population),
7 + url('market', views.market),
8 + url('', views.main),
6 ] 9 ]
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -2,20 +2,33 @@ from django.shortcuts import render ...@@ -2,20 +2,33 @@ from django.shortcuts import render
2 from django.db.models import Count 2 from django.db.models import Count
3 from .models import RT_edu, Maps, RT_agri_policy 3 from .models import RT_edu, Maps, RT_agri_policy
4 4
5 -# Create your views here. 5 +# Create your views here.
6 6
7 -def dbselect(dbnameis): 7 +def dbselect(contenttype, maptype):
8 - if dbnameis=='agri': 8 + if maptype == 9:
9 - policys = RT_agri_policy.objects.values('cntr').annotate(count=Count('cntr')) 9 + mapt = 'city'
10 - return policys 10 + elif maptype == 10:
11 - elif dbnameis=='normal': 11 + mapt = 'cntr'
12 - educations = RT_edu.objects.values(city='city').annotate(count=Count('city'))
13 - return educations
14 12
13 + if contenttype=='policy':
14 + myrtrn = RT_agri_policy.objects.values(mapt).annotate(count=Count(mapt))
15 + return myrtrn
16 + elif contenttype=='edu':
17 + myrtrn = RT_edu.objects.values(mapt).annotate(count=Count(mapt))
18 + return myrtrn
15 19
16 -def maplist(request): 20 +def main(request):
17 - mapp = Maps.objects.get(id=10) 21 + return render(request, 'main.html')
22 +
23 +def returnfarm(request, maptype):
24 + mapp = Maps.objects.get(id=maptype)
18 mapp = mapp.mapdata 25 mapp = mapp.mapdata
19 - exportdatas = dbselect('agri') 26 + exportdatas = dbselect('policy', maptype)
20 context = {'exportdata': exportdatas, 'maps':mapp} 27 context = {'exportdata': exportdatas, 'maps':mapp}
21 - return render(request, 'maplist.html', context) 28 + return render(request, 'returnfarm.html', context)
29 +
30 +def population(request):
31 + return render(request, 'population.html')
32 +
33 +def market(request):
34 + return render(request, 'market.html')
...\ No newline at end of file ...\ No newline at end of file
......