Spaces:

jonghhhh
/

journalism

Sleeping

App Files Files Community

jonghhhh commited on May 29

Commit

a760182

•

1 Parent(s): 96c95fa

Upload 9 files

Browse files

Files changed (10) hide show

.gitattributes +1 -0
app.py +68 -0
bokeh_example.html +0 -0
data_traffic_accidents.xlsx +3 -0
folium_example.html +127 -0
network.png +0 -0
photo1.jpg +0 -0
photo2.jpg +0 -0
requirements.txt +9 -0
wordcloud.png +0 -0

.gitattributes CHANGED Viewed

@@ -33,3 +33,4 @@ saved_model/**/* filter=lfs diff=lfs merge=lfs -text
 *.zip filter=lfs diff=lfs merge=lfs -text
 *.zst filter=lfs diff=lfs merge=lfs -text
 *tfevents* filter=lfs diff=lfs merge=lfs -text

 *.zip filter=lfs diff=lfs merge=lfs -text
 *.zst filter=lfs diff=lfs merge=lfs -text
 *tfevents* filter=lfs diff=lfs merge=lfs -text
+data_traffic_accidents.xlsx filter=lfs diff=lfs merge=lfs -text

app.py ADDED Viewed

	@@ -0,0 +1,68 @@

+import streamlit as st
+import pandas as pd
+import matplotlib.pyplot as plt
+import pandas_bokeh
+import folium
+from streamlit_folium import st_folium
+import requests
+st.markdown("# 경희대 인근 가성비 좋은 맛집 늘어 ... 건강식은 '글쎄'")
+st.markdown("#### '분식, 중식, 한식에 일식까지 다양한 음식 싸게 제공")
+st.markdown("#### 축제 행사에 햄버거-핫도그 푸드트럭도 등장")
+st.write('''경희대 인근에는 최근 가성비 좋은 맛집들이 속속 들어서며 학생들 사이에서 인기를 끌고 있다. 한정된 대학생 지갑사정에 맞는 저렴한 가격과 다양하고 퀄리티 높은 메뉴로 입소문이 나면서 성업 중인 것이다.
+이처럼 경희대 주변에는 학생들 사이에서 입소문이 자자한 가성비 맛집들이 많다. 뿐만 아니라 대학 축제 때면 다양한 [푸드트럭](https://namu.wiki/w/%ED%91%B8%EB%93%9C%20%ED%8A%B8%EB%9F%AD)들도 찾아와 저렴하고 맛있는 메뉴를 선보이며 큰 인기를 끈다.
+최근 물가상승으로 인해 외식비 부담이 큰 대학생들에게 이런 가성비 높은 맛집과 푸드트럭은 환영받을 만하다.''' )
+st.write("<br><br><br>", unsafe_allow_html=True) # 3줄 띄어쓰기
+st.markdown("#### 싼 게 비지떡? 건강식은 안 보이네")
+st.markdown("#### 저렴하고 푸짐하지만 영양과 건강은 실종")
+st.write('''경희대 인근 맛집들의 메뉴를 자세히 보면 건강한 식재료나 영양은 크게 고려되지 않은 것 같아 아쉬움이 남는다.
+대학가에서 건강에 대한 고민보다 싸고 배부르게 먹을 수 있는 곳이 인기인 점은 이해된다. 하지만 한번쯤은 영양과 건강을 생각해봐야 한다.
+청년때부터 건강식을 섭취하고 올바른 식습관을 가져야하기 때문이다.''' )
+st.markdown("#### 대학가 먹거리, 건강의 균형을 잡아야 할 때")
+st.write(''' 전문가 OOO에 따르면 ~~~~~''')
+# 사진 삽입
+st.image('photo1.jpg', caption='지난 4월20일 경희대 교내에서 학생들이 푸드트럭에서 음식을 구매하고 있다')
+st.image('photo2.jpg', caption='경희대 근처 맛집 지도(--- 제공)')
+# 데이터 불러오기
+df = pd.read_excel('data_traffic_accidents.xlsx', index_col=0)
+st.write('다음 데이터는 전국의 교통사고를 지역별로 집계한 것이다')
+#st.write(df)
+# 검색어 입력 받아 데이터 선택적으로 출력
+query = st.text_input('이 곳에 지역명(시군구동읍면)을 입력하면 관련 데이터만 검색해 보여줍니다', key='region1_input')
+df['select1']=df['사고지역위치명'].apply(lambda x: 1 if query in x else 0)
+st.write('검색 결과:', df[df['select1']==1])
+# 교통사고 유형과 연도에 따른 pivot table 보여주기
+df_pivot=df.pivot_table(index='사고유형구분', columns='사고연도', values='사고건수', aggfunc='sum')
+df_heatmap=df_pivot.style.background_gradient(cmap='Oranges').format("{:.2f}")
+st.write('다음 표는 교통사고 건수를 유형과 연도에 따라 구분한 것이다', df_heatmap)
+# 워드클라우드 보여주기
+st.write('주요  단어들을 워드클라우드로 보여주면 다음과 같다')
+st.image('wordcloud.png')
+# 연결망그림 보여주기
+st.write('''취재팀은 주요  단어들 간에 공동출현하는 관계를 바탕으로 의미연결망을 그려보았다.
+        분석결과, ~~설명~~''')
+st.image('network.png')
+# 그래프 html 보여주기
+st.write('''취재팀은 교통사고 사고건수와 사망자수 간의 관계를 그래프로 표시했다 분석결과, ~~설명~~
+그래프 각 점에 마우스를 놓으면 지역 정보가 나타난다''')
+with open('bokeh_example.html', 'r', encoding='utf-8') as f:
+    html_content1 = f.read()
+st.components.v1.html(html_content1, height=500) # markdown보다 복잡한 html 파일 작동에 강함
+# 지도 html 보여주기
+st.write('''취재팀은 서울시 주요 대학의 위치와 정보를 지도에 표기해 보았다. 분석결과, ~~설명~~
+지도 위 표기 지점에 마우스를 놓으면 관련 정보가 나타난다''')
+with open('folium_example.html', 'r', encoding='utf-8') as f:
+    html_content2 = f.read()
+st.components.v1.html(html_content2, height=500)

bokeh_example.html ADDED Viewed

The diff for this file is too large to render. See raw diff

data_traffic_accidents.xlsx ADDED Viewed

	@@ -0,0 +1,3 @@

+version https://git-lfs.github.com/spec/v1
+oid sha256:6cbe09c6afa2d36d525aaf0e9efd7a726c296f8b59ab50b2703979e52d478469
+size 5148724

folium_example.html ADDED Viewed

	@@ -0,0 +1,127 @@

+<!DOCTYPE html>
+<html>
+<head>
+    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
+        <script>
+            L_NO_TOUCH = false;
+            L_DISABLE_3D = false;
+        </script>
+    <style>html, body {width: 100%;height: 100%;margin: 0;padding: 0;}</style>
+    <style>#map {position:absolute;top:0;bottom:0;right:0;left:0;}</style>
+    <script src="https://cdn.jsdelivr.net/npm/leaflet@1.9.3/dist/leaflet.js"></script>
+    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.js"></script>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet@1.9.3/dist/leaflet.css"/>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css"/>
+    <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css"/>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.2.0/css/all.min.css"/>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.css"/>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/python-visualization/folium/folium/templates/leaflet.awesome.rotate.min.css"/>
+            <meta name="viewport" content="width=device-width,
+                initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+            <style>
+                #map_ed45e426e4e625d1487296ea56b9516c {
+                    position: relative;
+                    width: 100.0%;
+                    height: 100.0%;
+                    left: 0.0%;
+                    top: 0.0%;
+                }
+                .leaflet-container { font-size: 1rem; }
+            </style>
+</head>
+<body>
+            <div class="folium-map" id="map_ed45e426e4e625d1487296ea56b9516c" ></div>
+</body>
+<script>
+            var map_ed45e426e4e625d1487296ea56b9516c = L.map(
+                "map_ed45e426e4e625d1487296ea56b9516c",
+                {
+                    center: [37.567, 126.978],
+                    crs: L.CRS.EPSG3857,
+                    zoom: 12,
+                    zoomControl: true,
+                    preferCanvas: false,
+                }
+            );
+            var tile_layer_41a0f1aae01a4ef313b7f6ff18d8d25a = L.tileLayer(
+                "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
+                {"attribution": "Data by \u0026copy; \u003ca target=\"_blank\" href=\"http://openstreetmap.org\"\u003eOpenStreetMap\u003c/a\u003e, under \u003ca target=\"_blank\" href=\"http://www.openstreetmap.org/copyright\"\u003eODbL\u003c/a\u003e.", "detectRetina": false, "maxNativeZoom": 18, "maxZoom": 18, "minZoom": 0, "noWrap": false, "opacity": 1, "subdomains": "abc", "tms": false}
+            ).addTo(map_ed45e426e4e625d1487296ea56b9516c);
+            var marker_40a0d3b3071e46ce44c855dd28b7197e = L.marker(
+                [37.592, 127.052],
+                {}
+            ).addTo(map_ed45e426e4e625d1487296ea56b9516c);
+        var popup_c08cc328a5125b3fad894b79123b4297 = L.popup({"maxWidth": 500});
+                var html_b3968776944b9326f1cbe8befde69049 = $(`<div id="html_b3968776944b9326f1cbe8befde69049" style="width: 100.0%; height: 100.0%;">경희대</div>`)[0];
+                popup_c08cc328a5125b3fad894b79123b4297.setContent(html_b3968776944b9326f1cbe8befde69049);
+        marker_40a0d3b3071e46ce44c855dd28b7197e.bindPopup(popup_c08cc328a5125b3fad894b79123b4297)
+        ;
+            marker_40a0d3b3071e46ce44c855dd28b7197e.bindTooltip(
+                `<div>
+                     클릭
+                 </div>`,
+                {"sticky": true}
+            );
+            var marker_d35363d0a8fe53316869ae36187a1457 = L.marker(
+                [37.56, 126.937],
+                {}
+            ).addTo(map_ed45e426e4e625d1487296ea56b9516c);
+        var popup_d92fbb3aa56507683aedb49a771e3e7a = L.popup({"maxWidth": 500});
+                var html_81e8244e5d4ab9b0ada91f9b0c8ffa5e = $(`<div id="html_81e8244e5d4ab9b0ada91f9b0c8ffa5e" style="width: 100.0%; height: 100.0%;">연세대</div>`)[0];
+                popup_d92fbb3aa56507683aedb49a771e3e7a.setContent(html_81e8244e5d4ab9b0ada91f9b0c8ffa5e);
+        marker_d35363d0a8fe53316869ae36187a1457.bindPopup(popup_d92fbb3aa56507683aedb49a771e3e7a)
+        ;
+            marker_d35363d0a8fe53316869ae36187a1457.bindTooltip(
+                `<div>
+                     클릭
+                 </div>`,
+                {"sticky": true}
+            );
+</script>
+</html>

network.png ADDED Viewed

photo1.jpg ADDED Viewed

photo2.jpg ADDED Viewed

requirements.txt ADDED Viewed

	@@ -0,0 +1,9 @@

+streamlit
+pandas
+openpyxl
+matplotlib
+pandas-bokeh
+bokeh==2.4.3
+folium
+streamlit-folium
+requests

wordcloud.png ADDED Viewed