index.html
1.35 KB
<!DOCTYPE html>
<html>
<head>
<title>Take an Umbrella</title>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<h1 style="font-family:Nanum Gothic;"> Take an Umbrella </h1>
<h3 style="font-family:Nanum Gothic;"> 철학과 2017101598 맹주환 </h3>
<pre align="center" style="font-family:Nanum Gothic;" font size="20">
반가워요!
Take an umbrella는 스마트 조명 제품 Philips hue API와 기상청 공공데이터 날씨 API로 구성되어 있어요.
Hue가 연결된 WI-FI로 접속하셔서 아래의 지도로 현재 위치를 조회하시면, 해당 지역 기상 예보를 받아와 조명을 통해 우산을 챙겨야 하는지 알려줘요!
</pre>
<div id="map"></div>
<!-- Async script executes immediately and must be after any DOM elements used in callback. -->
<h1 style="font-family:Nanum Gothic;"> 당신의 현재 위치 </h1>
<div align="center">현재 위도: <span id="lat"></span></div>
<div align="center">현재 경도: <span id="lng"></span></div>
</body>
<script src="map.js"></script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAguo3zH8vWZJbzXEqyp8D8UvnBh3zX8rQ&callback=initMap&v=weekly" async> </script>
</html>