UNPKG

letsee-geofencing

Version:

letsee geofencing npm package

103 lines (71 loc) 2.81 kB
# Letsee-Geofencing --- ## 사용법 #### 1. 패키지 설치 ```shell npm i letsee-geofencing@latest ```      #### 2. GeofencingMap : Admin의 Geofence Map Tool 컴포넌트 ```javascript import { GeofencingWorker, GeofencingMap, Client } from 'letsee-geofencing' const App = () => { // new GeofencingWorker(GateHostURL[String], MasterId[String], ProjectId[String]) const gw = new GeofencingWorker('https://192.168.1.6:8000', 'test', '1'); return( <> // <GeofencingMap>의 파라메터 // geofencingWorker : GeofencingWorker class (필수) // initCenter : 처음 지도 오픈 시 지도의 중심 위/경도 좌표. (default: [lat, lng]) // initZoom : 처음 지도 오픈 시 Zoom 정도. 숫자가 클수록 좁은 범위를 넓게 볼 수 있음. 1~19 (default: 13) <GeofencingMap geofencingWorker={gw} initCenter={[37.506012, 127.058175]} initZoom={13} /> </> ) } export default App ```      #### 3. Client : Client의 Tracker 클래스 ```javascript import { GeofencingWorker, GeofencingMap, Client } from 'letsee-geofencing' const App = () => { // new GeofencingWorker(GateHostURL[String], MasterId[String], ProjectId[String]) const gw = new GeofencingWorker('https://192.168.1.6:8000', 'test', '1'); // new Client(geofencingWorker[GeofencingWorker], Client_id[String]) let client = new Client(gw, 'test_id'); // 사용자의 위치(GPS)가 Fence 내부에 있을때 실행되는 함수 const userInside = (fenceData) => { console.log("inside!!", fenceData) } // 사용자의 위치(GPS)가 Fence 외부에 있을때 실행되는 함수 const userOutside = () => { console.log("outside!!") } // client.startGPS(insideCB, outsideCB, _options); client.startGPS( userInside, userOutside ); return( <> </> ) } export default App ```      ### 4. 설명 `GeofencingWorker` Class는 Backend의 Gate와 통신하는 주체로, 1. Gate의 URL 2. MasterId 3. ProjectId 세 파라메터를 가지고 생성되며, GeofencingMap과 Client 모두에 사용된다. `Client` Class의 startGPS() 함수 내부에서는 navigator.geolocation.watchPosition()이 생성된다. ```javascript startGPS([팬스 내부일때 실행할 콜백함수], [팬스 외부일때 실행할 콜백함수], [watchPosition의 옵션]) ``` [watchPosition의 옵션](https://developer.mozilla.org/en-US/docs/Web/API/Geolocation/getCurrentPosition): maximumAge, timeout, enableHighAccuracy --- ## 수정 및 NPM 배포 ```shell git clone https://github.com/letsee/letsee-geofencing-npm.git git checkout develop npm i # 코드 수정 npm version patch -f ## 혹은 npm version 0.4.0 -f npm publish ```