본문 바로가기

Open API

 (82)
[Google Map] Places search box 구글 자동완성을 이용한 위경도 값 가져오기 구글맵 위치정보를 활용한 자동완성 기능을 적용시키는 샘플 구글의 정보는 정말 말로 할수없을 만큼 방대합니다. 그 중에서 맵데이터는 정말 놀라운데요. 기존에 장소(정확히는 도시별)별 위경도 값을 직접 데이터관리하던 부분을 구글 장소 검색 ( Places Search Box ) 기능으로 대체하게 되었습니다. 잘 구축된 API를 잘 가져다 쓰면 되기 때문에 참 편하죠. 자동완성의 반응속도도 빠르고 나름 직접 관리하는 것보다 정확하기 때문에 여러모로 유용할것같습니다. 실제로 구현 하는 경우에는 가장 하단에 Js 참조할때 key 값을 입력해야합니다. https://maps.googleapis.com/maps/api/js?key=여기에키값입력&libraries=places&callback=initAutocomple..
Javascript , Data URL을 이용한 엑셀 파일 생성하기 javascript 에서 테이블 구조의 html을 전달 받아 Excel 파일을 생성하는 함수 입니다. 기본적으로 서버에서 만들어진 내용을 다운받도록 하지만 클라이언트 쪽에서 바로 xls 파일을 생성 할 수 있도록 하는 방법입니다. 기본문법 : data:[][;base64], function fnExcelReport(cont, fileName) { var ua = window.navigator.userAgent; if ( (navigator.appName == 'Netscape' && ua.search('Trident') != -1) || (ua.indexOf("msie") != -1) ) // IE { newWin = window.open(); newWin.document.open("txt/html","..
jquery ajax 동기처리가 안되는 경우.. async 옵션이 적용 안될 때. jQuery ajax 옵션중에는 async 옵션이 있습니다.이것은 기본적으로 ajax가 비동기 처리를 하지만 필요에 따라 동기 요청을 하기 위한 옵션이지만최근 경험상 적용이 되지 않는 것이 확인되어 api 사이트를 확인해보니 아래와 같은 내용이 확인이 됩니다. 크로스 도메인일 경우 데이터 타입이 jsonp라면 지원되지 않는다. 위의 조건 외에도 1.8 버전 이후부터 지원되지 않음이라고 명시되어있고 콜백 함수를 이용하도록 명시가 되어있으니 1.8버전 혹은 최신 버전을 사용하는 경우 문제가 될 것같습니다. 그런데...되는 경우도 있고..안되는 경우도 있고...모호하네요. 확실하게 그냥 콜백 함수를 사용해야겠습니다. async (default: true) Type: BooleanBy default, all r..
modal 팝업창에서 datepicker 사용 시 연도 월 Select box가 열리지 않는 문제 해결 방법 Bootstrap modal 팝업창에서 datepicker 사용 시 changeMonth , changeYear 옵션을 true 로 사용할 경우 정상적으로 펼쳐지지 않고 바로 닫히는 버그가 있는데 꽤 오래된 상황임에도 업데이트가 되어지지 않고 있습니다. 하지만, 역시 스택오버플로우 https://stackoverflow.com/questions/22050641/month-select-in-datepicker-inside-a-bootstrap-modal-wont-work-in-firefox 해결 방안을 제시해줍니다. $('#modal').on('show', function () { $.fn.modal.Constructor.prototype.enforceFocus = function () { }; }); 위..
카카오링크 보내기 ( Kakao.Link ) 동적으로 바뀌는 내용의 카카오링크를 보내는 예제입니다. 카카오 Developers 페이지에서도 확인 하실 수 있습니다. https://developers.kakao.com/docs/js 추가적인 함수들은 아래 링크에서 확인가능합니다. https://developers.kakao.com/docs/js-reference#kakao_link 적용하기 위해서는 api 와 url 정보 변경이 필요합니다. 샘플 Url : http://www.uhoon.co.kr/dev/kakao/83.html 카카오톡 앱이 설치되어 있는 모바일 기기라면 아래의 링크가 동작합니다.
카카오톡 개발자 등록 및 애플리케이션 등록 카카오 API도 버전이 올라가며 많이 바뀌었네요. 밑바닥 부터 천천히 하나씩 짚어봐야겠습니다. 첫발을 내딛기 위해서는 등록부터.. ▼ https://developers.kakao.com/ Kakao Developers에 로그인 합니다. ▼ https://developers.kakao.com/apps 내 애플리케이션 메뉴에서 앱 만들기를 선택합니다. ▼ 앱 이름을 적고 앱 만들기를 클릭 ▼ 필요한 경우 앱 아이콘을 업로드 할수도 있습니다. ▼ 등록하면 인증키가 바로 발급됩니다. ▼ 키가 발급되었어도 플랫폼 등록을 해야 실제 사용이 가능합니다. ▼ 당분간은 어플 사용할 계획이 없으므로 웹으로 등록해봅니다. ▼ 실제로 키가 유출되어도 플랫폼 등록이 안되어있게되면 인증 오류가 발생하므로 걱정없습니다..ㅎㅎ 이렇..
네이버 맵 (기본 맵 + 마커) v3 네이버 기본 맵 ( 마커 찍기 + 라벨 넣기 ) Test Url : http://www.uhoon.co.kr/test/995.html 네이버 API 키 발급 Url : https://dev.naver.com/openapi/register
네이버 스마트 에디터 ( 이미지 업로드 포함 ) 스마트 에디터에 이미지 업로드 기능을 추가된 샘플 소스입니다.. jimmy1775 님께서 asp 업로드 모듈을 개발해주시고 idtong 님께서 jsp 모듈을 개발해주셨습니다.. 감사드립니다. Test UIrl : http://www.uhoon.co.kr/test/988/SmartEditor/SEditorDemo.html DownLoad : (2013.06.30 추가) ps. 추가로 이미지 업로드 가능한 mimetype 을 일부 추가하였습니다..( png 등...) 적용 방법 : 1. 압축 해제 후 SEditorDemo.html 파일을 제외한 나머지 파일은 에디터가 삽입될 페이지와 같은 경로에 업로드하거나 또는 임의의 위치에 압축 해제 후 include된 경로를 수정하여 업로드 합니다. ( 아래 설명은 같..

티스토리툴바