본문 바로가기
728x90
반응형

javascript, jQuery/API4

[API/javascript] 구글 차트 API - jstl 데이터 필터링 안녕하세요. 이번 포스팅은 구글 차트 API를 다뤄보겠습니다. 아래는 구글 차트 사이트인데요 developers.google.com/chart Charts | Google Developers Interactive charts for browsers and mobile devices. developers.google.com 바로 본론으로 넘어가겠습니다. 일단 구글차트를 사용하려면 스크립트를 불러올수 있도록 해야합니다. head 부분에 구글차트를 로드해줍니다. div를 예쁘게 만들어주기 위해서 CSS Style 도 만들어 놓겠습니다. body부분의 div도 만들어 줍니다. body밑에 스크립트를 만들어줍니다. body 밑에 만드는 이유는, 스크립트가 다 불러와지고 그 다음에 div를 만들면 늦더라구요.. 그.. 2021. 4. 13.
[API] Chart.js CDN 붙여넣기/ 다운로드 안녕하세요 이번 포스팅은 Chart.js를 사용하는 내용을 다뤄보겠습니다. Chart JS 홈페이지 : www.chartjs.org/ (1) 사용 준비 - 1. CDN Chart JS를 사용하기 위해서는 다운받거나 jQuery처럼 CDN을 붙여야 합니다. cdnjs.com/libraries/Chart.js △△△ 위 사이트에서 CDN을 복사해서 붙여넣을 수 있는데요 하지만 이걸 여러번 붙여야하니 귀찮을 따름입니다. 어떤 분이 하나만 붙여서 CDN을 사용하던데 좋아보이더라구요. 위의 소스를 붙였습니다. 실행이 잘 되더라구요 :) - 2. 다운로드(npm) 저는 npm을 이용해서 다운받았습니다. npm이란 Node Package Manager 의 줄임말인데요. nvm을 설치하면 npm 명령어를 사용할 수 있.. 2021. 4. 5.
[javascript_api] geolocation으로 받은 위도,경도로 지도에 표시하기 안녕하세요, 이번에는 지난 포스팅에 이어 geolocation api를 이용하여 얻은 위도, 경도로 지도상에 표현해보려고 합니다. 먼저 지난번에 이어서 geolocation navigator를 다시 사용하겠습니다. 새로 추가된 코드는 makeMap 함수입니다. 위도와 경도를 받아서 iframe으로 구글맵 지도를 보여줍니다. 원래는 카카오맵 API를 사용하여 보여드리려 했으나, 실제로 서비스하는 홈페이지가 아닌, 블로그 상으로 띄우려해서 그런지 api 호출이 되질 않는 것 같습니다. 그러면 지도를 확인해보겠습니다. 2020. 11. 26.
[javascript_api] geolocation을 이용해 현재 IP주소로 위도, 경도값 받기 안녕하세요, 이번 포스팅은 geoLocation API를 이용하여 현재 웹에 접속한 IP의 위도, 경도값을 받아보려고 합니다. geoLocation API는 Chrome 50버전 이후로 HTTPS 환경에서만 사용 가능합니다. http://localhost 에서는 사용이 가능하며, 테스트 목적으로, Chrome의 바로가기를 만들어서 아래와 같이 설정하면 접속은 가능합니다. chrome.exe --unsafely-treat-insecure-origin-as-secure="http://example.com" 먼저 위도, 경도를 받아오기 위해 navigator.geolcation을 사용합니다. 다음, 위도, 경도값을 받을 입력창을 만들어줍니다. 위도 : 경도 : 위도, 경도 값이 제대로 전달 되는지 확인합니다... 2020. 11. 25.
728x90
반응형