개발활용툴10 무료 아이콘(icon) 활용하기 어플리케이션을 개발하다 보면 메뉴나 목록 보기, 버튼 등 다양한 기능들을 구현하는데 있어서 텍스트 보다는 간결하고 직관적인 아이콘을 사용하는 것이 더 UI 및 UX 측면에서 보면 보기 좋습니다. 일반 간단한 어플리케이션 개발에는 쉽게 적용할 수 있는 무료로 제공하는 사이트가 있어서 소개하고자 합니다. 앱 어플리케이션 개발에는 안드로이드는 구글이, iOS는 애플이 기본적으로 제공하는 아이콘들도 쉽게 적용해 볼 수있고, 웹 어플리케이션 개발의 경우 좀 더 개성있는 사이트 개발을 위해 좀 더 차별화된 아이콘을 사용할 수 있습니다. 물론 이러한 디자인된 아이콘의 경우 유료서비스로 제공하는 경우가 대부분이므로 참고하시기 바랍니다. 좀 더 쉽게 사용할 수 있는 사이트를 소개하고자 합니다. 1. 구글 머트리얼심볼 (.. 2023. 12. 29. 날씨 API - OpenWeather 사용하기(2) 2023.12.13 - [개발활용툴] - 날씨 API - OpenWeather 사용하기(1) 날씨 API - OpenWeather 사용하기(1) 날씨 정보는 다양한 종류에 활용도가 높은 컨텐츠 중에 하나입니다. 본인이 제공하는 주요 컨텐츠에 맞게 적절하게 사용한다면 좀 더 풍부한 정보를 가진 사이트를 만들 수 있겠습니다. 여러 종 peter-codinglife.tistory.com 이전 블로그에 이어서 실제 OpenWeather API 사용 예시입니다. 예시는 아래와 같이 경복궁 소개 상세페이지입니다. 기본정보 이외 지도에 위치정보를 보여주고, 현재 날씨 정보를 보여줍니다. 날씨정보 표출 내용은 날씨 아이콘, 온도, 기준 시간 입니다. show.ejs 파일 - 지도 및 날씨 정보 표출 하기 ℃ contr.. 2023. 12. 14. 날씨 API - OpenWeather 사용하기(1) 날씨 정보는 다양한 종류에 활용도가 높은 컨텐츠 중에 하나입니다. 본인이 제공하는 주요 컨텐츠에 맞게 적절하게 사용한다면 좀 더 풍부한 정보를 가진 사이트를 만들 수 있겠습니다. 여러 종류의 날씨 API 중에서 개발용으로 무료로 사용할 수 있는 API로 OpenWeather 를 사용하는 방법에 대해 간단하게 공유하고자 합니다. OpenWeather 특성은 전세계 날씨 데이터를 가져올 수 있고, 현재 날씨 뿐만아니라 주간날씨를 무료로 이용할 수 있습니다. 1. OpenWeather 회원가입 하기 https://openweathermap.org/ Сurrent weather and forecast - OpenWeatherMap Access current weather data for any location .. 2023. 12. 13. Mapbox사용법(5) - Mouse Event 이전 블로그에 이어서 지도에 마우스 클릭으로 해당 위치의 좌표값을 취득하는 방법에 대해 알아 보고자 합니다. geocoding 으로 주소지 또는 POI 정보로 지도 경위도 좌표값을 얻을 수 있는데 Mapbox에서 모든 정보를 가지고 있지 않기 때문에 정확한 위치로 매칭되지 않을 수 있습니다. 2023.12.11 - [개발활용툴] - Mapbox사용법(4) - geocoding Mapbox사용법(4) - geocoding Mapbox에서 지원하는 다양한 기능중에서 실제 어플리케이션 개발시 사용할 만한 기능에 대해 설명하고자 합니다. geocoding(지오코딩) 기능은 주소지 또는 POI(시설물) 정보를 텍스트로 입력시 GPS 경 peter-codinglife.tistory.com 정확한 위치 값을 얻기 위.. 2023. 12. 12. Mapbox사용법(4) - geocoding Mapbox에서 지원하는 다양한 기능중에서 실제 어플리케이션 개발시 사용할 만한 기능에 대해 설명하고자 합니다. geocoding(지오코딩) 기능은 주소지 또는 POI(시설물) 정보를 텍스트로 입력시 GPS 경위도 위치값으로 변환시켜주는 기능입니다. 즉, 구글, 네이버 지도에서 시설물이나 지도 검색시 지도에 해당 정보 위치를 표시해주는 기능으로 이해하면 됩니다. 구체적인 사용 방법의 이해를 돕기위해 예시를 들어 설명하겠습니다. 1. Geocoding API 사용하기 [참고] Mapbox Documentation https://docs.mapbox.com/api/search/geocoding/ Geocoding API | API Docs The Mapbox Geocoding API runs forward .. 2023. 12. 11. Mapbox 사용법(3) Marker 표출하기 이전 블로그에서 Mapbox 기본 사용법과 클러스터맵 사용예시를 보았습니다. 이번에는 POI(Point of Interrest) 상세정보 표출시 사용하는 마커가 있는 지도를 어떻게 설정하면 되는지 알아 보겠습니다. 1. 지도표출 화면 container id를 map 으로 지정합니다. 지도에 표출할 데이터와 mapToken을 2. 지도 표출 설정하기 mapboxgl.Map() 으로 기본적인 지도를 지정합니다. 지도표출 위치는 넘겨 받은 GPS 데이터로 지정합니다. 일반적으로 GPS좌표는 위도, 경도 순서로 표출하는데 Mapbox에서는 경도, 위도 기준으로 지정해야 합니다. 지도위 marker 표출은 mapboxgl.Marker() 로 지정합니다. Marker의 위치는 setLngLat 로 지정하고, Mar.. 2023. 11. 13. 이전 1 2 다음 반응형
