2017-03-30 8 views
1

POI (Points of Interest)를 나타내는지도에 다양한 크기의 아이콘을 만들고 싶습니다. 여유 공간이 충분하면 큰 아이콘을 사용해야합니다. 혼잡 한 지역에서는 작은 아이콘이 사용됩니다. 예를 들어지도에 겹치지 않는 POI 아이콘을 만드는 알고리즘

: enter image description here

Sygic Travel에서이다. 밀도는 다양한 줌 레벨에서 유지됩니다. 눈에 띄는 관심 장소에 다양한 가중치로 더 크게 표시되도록 가중치를 부여한다고 가정합니다. 지금까지 탐구 한 내용을

은 다음과 같습니다 그리드 poisition에 의해

  • 비닝. 이 방법은지도를 격자 사각형으로 나누고 각 사각형에 몇 개의 POI가 발생하는지 계산합니다. 광장에 단 하나의 관심 장소가있는 경우 가장 큰 아이콘으로 표시 될 수 있습니다. 두 개 이상 나타나면 더 작아야합니다. 이 방법은 POI의 중심을 사용하므로 인접한 모서리에 두 개의 POI가 발생하더라도 여전히 중첩됩니다.
  • 아이콘이 분산되어 있습니다. 이 방법은 POI가 특정 임계 값보다 가까울 때 서로 POI를 간단히 푸시합니다. 문제는 다른 POI에 푸싱되어 겹칠 수 있다는 것입니다. 또한지도상의 POI 위치가 보존되지 않기 때문에 정확도가 떨어집니다.

이제 물리 엔진과 같은 충돌 감지 기능을 탐색하려고합니다. 오버랩을 방지 할 수는 있지만 다양한 크기의 아이콘 요구 사항을 어떻게 달성 할 수 있는지 확실하지 않습니다. 또 다른 기법은 그리드 공간 겹침 (grid space overlap)의 검출을 통한 다중 패스 비닝 (binning binning) 일 수있다.

여기 알고리즘이 누락 되었습니까? 아니면 제가 참조 할 수있는이 문제에 대한 기존 해결책이 있습니까?

답변

1

알고리즘은 매우 간단합니다 :

지도 영역은 일반적으로 (예를 south:51.482238, west: -0.18462181, north: 51.529571733, east: -0.058450698에 대한) 위도와 경도도 당신이 내 일부 위도와 경도 좌표를 가지고 그리려는 또한 포인트를 사용하여 일부 경계에 의해 정의된다

경계.

당신은 (크기가 일반적으로 브라우저에서 맵의 크기에 의해 정의된다)

좌표를 시작으로지도의 한쪽 모서리를 선택 예를 1200x800 픽셀의 픽셀 캔버스로지도 생각할 수

[0,0] (대한 예 : [south, west]) 캔버스 픽셀 좌표로 점의 위도, 경도 좌표를 변환합니다.

그런 다음 우선 순위에 따라 점을 정렬하고지도에 하나씩 차례대로 배치합니다. 그리기를 원하는 표식의 크기와 이미 그려진 표식을 알고 있으므로 픽셀 캔버스에서 충돌 가능성을 쉽게 감지 할 수 있습니다. 발견 된 충돌 수단보다 우선 순위가 높은 지점이 장소를 차지했습니다. 점이 거대한 표식으로지도에 맞지 않으면 우리는 더 작은 표식으로 배치하려고합니다.

+0

어떻게 충돌을 감지합니까? 우선 가장 우선 순위가 높은 부분을 큰 아이콘으로 배치 한 다음 남은 공간에 따라 전체를 더 작게 만들거나 사라지게하는 것 같습니다. 가장 가까운 이웃 거리를 계산하고 임계 값 이상인 경우 아이콘을 표시합니까? –

+0

어떤 마커 (위치와 반경 + 약간의 여백)가 이미 캔버스에 있는지 알고 있고 단순히 모든 후보와 새로운 후보의 충돌을 확인합니다. 충돌 감지는 단순한 평면 형상을 사용하여 수행됩니다 (https://developer.mozilla.org/en-US/docs/Games/Techniques/2D_collision_detection 참조). 이 알고리즘의 출력은 점의 범주입니다. : 같은 뭔가 {거대한 : [점, 점, 점, 중간 : [점, 점, 점, ...]} 이건 그냥 기본적인 생각입니다. 그런 다음 다른 크기 사이에서 다른 여백을 가지고 놀거나 중요하지 않은 곳에서 거대한 마커를 허용하지 않을 수 있습니다. –