** 참고 사이트 **

PhoneGap 사이트의 API : http://docs.phonegap.com/plugin-apis/

튜토리얼 사이트 : http://www.w3ii.com/cordova/default.html




두가지 파일(index.html, index.js)만 수정하면 된다. 

  : index.html은 프로젝트 디렉터리로 이동해서 www 폴더를 열면 존재하고

  : index.js는 .js가 붙은거 보면 알겠지만 www폴더 밑에 js폴더 내에 존재한다.


작업은 html 만드는 것처럼 하면 된다.




[ Example ] gps 사용하기(안드로이드)


1. plugin 추가

  >cordova plugin add cordova-plugin-geolocation


2. index.html 문서에 버튼 두개 추가

  <button id = "getPosition">현재 위치</button>

  <button id = "watchPosition">실시간 위치</button>


3. index.js 문서에서 버튼값 찾아서 이벤트 걸기(onDeviceReady: function() { (여기에 주든지) }

  initialize: function() {

        document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);

        document.getElementById("getPosition").addEventListener("click", getPosition);

        document.getElementById("watchPosition").addEventListener("click", watchPosition);

    }


4.  index.js 문서에서 이벤트 함수 구현 (제일 끝에 추가)

  function getPosition() {

var options = {

      enableHighAccuracy: true,     // gps 사용

      maximumAge: 3600000        // 위치값 보관 시간

   }


   var watchID = navigator.geolocation.getCurrentPosition(onSuccess, onError, options);

   function onSuccess(position) {

      alert('Latitude: '          + position.coords.latitude          + '\n' +

         'Longitude: '         + position.coords.longitude         + '\n' +

         'Altitude: '          + position.coords.altitude          + '\n' +

         'Accuracy: '          + position.coords.accuracy          + '\n' +

         'Altitude Accuracy: ' + position.coords.altitudeAccuracy  + '\n' +

         'Heading: '           + position.coords.heading           + '\n' +

         'Speed: '             + position.coords.speed             + '\n' +

         'Timestamp: '         + position.timestamp                + '\n');

   };


   function onError(error) {

      alert('code: '    + error.code    + '\n' + 'message: ' + error.message + '\n');

   }

}


function watchPosition() {

   var options = {

      maximumAge: 3600000,    // 위치값 보관 시간

      timeout: 3000,                // 3초간 위치 추적

      enableHighAccuracy: true, // gps 사용

   }

   var watchID = navigator.geolocation.watchPosition(onSuccess, onError, options);


   function onSuccess(position) {

      alert('Latitude: '          + position.coords.latitude          + '\n' +

         'Longitude: '         + position.coords.longitude         + '\n' +

         'Altitude: '          + position.coords.altitude          + '\n' +

         'Accuracy: '          + position.coords.accuracy          + '\n' +

         'Altitude Accuracy: ' + position.coords.altitudeAccuracy  + '\n' +

         'Heading: '           + position.coords.heading           + '\n' +

         'Speed: '             + position.coords.speed             + '\n' +

         'Timestamp: '         + position.timestamp                + '\n');

   };


   function onError(error) {

      alert('code: '    + error.code    + '\n' +'message: ' + error.message + '\n');

   }

}


** 참고 사이트 **

PhoneGap 사이트의 API : http://docs.phonegap.com/plugin-apis/

튜토리얼 사이트 : http://www.w3ii.com/cordova/default.html




두가지 파일(index.html, index.js)만 수정하면 된다. 

  : index.html은 프로젝트 디렉터리로 이동해서 www 폴더를 열면 존재하고

  : index.js는 .js가 붙은거 보면 알겠지만 www폴더 밑에 js폴더 내에 존재한다.


작업은 html 만드는 것처럼 하면 된다.




[ Example ]


카메라 촬영 후 이미지를 보여주는 기능을 구현한다고 예를 들면,


1. index.html 문서에 버튼 추가

  <button id = "cameraTakePicture">사진촬영</button> 


2. index.js 문서에서 버튼값 찾아서 이벤트 주기 (onDeviceReady: function() { (여기에 주든지) }

  initialize: function() {

        document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);        

        document.getElementById("cameraTakePicture").addEventListener("click", cameraTakePicture);

  }


3. index.js 문서에 이벤트 구현 (제일 밑에 추가)

function cameraTakePicture() {

    navigator.camera.getPicture(onSuccess, onFail, { 

        quality: 50,

        destinationType: Camera.DestinationType.DATA_URL,

        correctOrientation: true

    });


    function onSuccess(imageData) {

        var image = document.getElementById('myImage');

        image.src = "data:image/jpeg;base64," + imageData;

    }


    function onFail(message) {

        alert('Failed because: ' + message);

    }

}


** navigator.camera.getPicture(onSuccess, onFail, { (여기에 입력되는 값들은 아래부분 참고) }


+ Recent posts