티스토리 뷰
내가 개발했던 환경
- 하이브리드 앱(안드 + 웹) hybrid App
- 전자정부프레임워크 eGov
- 알티베이스 Altibase
- 오픈소스 지도 api인 리플릿 Leaflet
선행 단계 - 내 위치 가져오기
링크 : 2019/07/12 - [개발] - 하이브리드앱에서 내 위치(좌표) 가져오기 #webview #javascriptinterface #gps
내 위치 좌표(예 : 37.262, 127.028)와 지정된 반지름을 가지고 circle을 그린다
var circle;
function drawCircle(lat, lng, distance){
if(distance == "" || distance == null) distance = 500; //기본 500m
if(map.hasLayer(circle)){
map.removeLayer(circle); //기존의 circle영역 삭제
}
circle = L.circle([lat, lng], distance, {
color: 'green',
fillColor: '#98FB98',
fillOpacity : 0.5
}).addTo(map);
};
그려진 circle의 북서, 북동, 남서, 남동의 좌표를 잡는다
var originNw = [circle.getBounds().getNorthWest().lat, circle.getBounds().getNorthWest().lng];
var originNe = [circle.getBounds().getNorthEast().lat, circle.getBounds().getNorthEast().lng];
var originSe = [circle.getBounds().getSouthEast().lat, circle.getBounds().getSouthEast().lng];
var originSw = [circle.getBounds().getSouthWest().lat, circle.getBounds().getSouthWest().lng];
var originCenter = [circle.getBounds().getCenter().lat, circle.getBounds().getCenter().lng];
//조합
var nW = originNw[0]+ " " + originNw[1];
var nE = originNe[0]+ " " + originNe[1];
var sE = originSe[0]+ " " + originSe[1];
var sW = originSw[0]+ " " + originSw[1];
//쿼리에 이용될 폴리곤 좌표
var polygon = nW + "," + nE + "," + sE + "," + sW + "," + nW;
날린다.
var resultList = "";
$.ajax({
type: "POST",
url: "/test.do",
data: {polygon : polygon},
dataType: "json",
success: function(data) {
resultList = data.resultList;
},
error : function(request, status, error) {
alert("에러가 발생하였습니다.");
}
});
쿼리
아래처럼 각 row마다 포인트로 GEOMFROMTEXT로 가져오게 되면 속도 이슈가 발생한다.
난 GEOMETRY타입의 컬럼 하나를 더 만들어서 기존의 X,Y데이터들을 모두 GEOMETRY컬럼으로 넣어 버렸다.
SELECT * FROM (
SELECT
/*+ RULE */
GEOMETRY'POLYGON(($polygon$))' AS F1 --폴리곤 공간
,GEOMFROMTEXT('POINT(' || T.X|| ' ' || T.Y ||')')) AS F2 -- row 각각의 포인트(좌표)
FROM TABLE_NAME T
) A
WHERE INTERSECTS(A.F1, A.F2) --알티베이스 함수. 포함되냐?
이제 사각 폴리곤 내의 포인트들을 가져왔다.
원형의 공간 내에 존재하는 것들만 골라내자.
var makeLatLngBounds = function(listData){
var arr = new Array(); //원 안의 포인트 데이터만 담을 ARRAY.
var radius = circle.getRadius();//그려진 원의 반지름.
$(listData).each(function() {
//x,y를 리플릿 맵 내 좌표 계산등에 이용되는 함수에 담는다.
var dataLatLng = new L.LatLng(this.x, this.y);
//해당 포인트의 위치와 원의 중심(내위치중심)과의 거리가 반지름 보다 작으면 false.
if(circle.getLatLng().distanceTo(dataLatLng) < radius){
arr.push(this);//true면 array에 담는다.
}
});
return arr;
};
골라내기와 뿌리기
var resultList = "";
$.ajax({
type: "POST",
url: "/test.do",
data: {polygon : polygon},
dataType: "json",
success: function(data) {
resultList = data.resultList;
resultList = makeLatLngBounds(resultList); //반경 내 결과물만 추출
//이제 골라낸 결과 가지고 여기다가 맵관련 함수 써서
//마커도 생성하거나 결과목록만 뿌려도 되고
//마음대로 하면 됨
},
error : function(request, status, error) {
alert("에러가 발생하였습니다.");
}
});
끝
'(구)개발' 카테고리의 다른 글
Spring Boot #2 / 스프링부트 MySql, MyBatis 연결 하기 (2) | 2019.12.04 |
---|---|
Spring Boot #1/ 스프링부트 시작하기 (0) | 2019.11.30 |
하이브리드앱에서 내 위치(좌표) 가져오기 #webview #javascriptinterface #gps (0) | 2019.07.12 |
내 인생을 바꿔줄 JAVA소스, 로또 (0) | 2019.07.10 |
jQeury) 무한 스크롤 Div 바닥 감지 이벤트 발생시키기 (0) | 2019.07.05 |
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
TAG
- 킹스의킹
- 스팀
- 디비전2
- java
- ec2
- 이클립스
- Spring
- 유플레이
- 점심
- 수원
- 자바
- 스프링
- 쿼리
- 벤치멤버
- 게임
- NBA
- Oracle
- 엑스박스
- nba2k19
- 새크라멘토킹스
- AWS
- android
- 토이프로젝트
- 오라클
- 프로그래머스
- 디비전
- jenkins
- docker
- springboot
- 패드
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
글 보관함