이번시간에는 컴퓨터에 저장되는 사용자의 웹 서핑 기록을 분석하여 이를 시각적으로 표현하는 기능을 구현 해 보았습니다..아래는 시연 동영상입니다. 우주공간의 한 지점을 하나의 웹사이트로 매핑 시키고 웹서핑 기록을 표현했습니다. 좌표 매핑 방법과 관련된 내용은 아래에서 더 자세하게 다루도록 하겠습니다.
컴퓨터 화면을 녹화한건데 화질이 좋지가 않아서 아쉽네요 ㅜ
로딩화면 입니다. 사용자의 컴퓨터에서 웹서핑 기록을 수집하는 화면 입니다. 웹서핑 기록은 인터넷 익스플로러에서 저장하는 데이터를 사용합니다. 이렇게 수집된 웹 서핑 데이터들은 각각의 페이지 단위로 저장되며 이를 다시 도메인 별로 분류하여 저장합니다.
이렇게 분류된 각각의 도메인들은 위 그림과 같이 하나의 원으로 화면에 출력되게 되는데 해당 도메인이 출력되는 위치는 아래와 같은 공식에 의해서 결정됩니다.
먼저 우리가 사용하는 인터넷 웹사이트의 주소는 문자로 되어있지만, DNS를 거치게 되면 32Bit의 IP주소로 변환되게 됩니다. 이렇게 32 Bit의 IP Data를 왼쪽 16Bit 오른족 16Bit로 나누고 왼쪽을 X좌표, 오른쪽을 Y좌표로 사용하여 각 도메인마다 화면상의 하나의 고유한 좌표를 사용하도록 합니다.
예를 들어서 아이피 주소가 211.189.124.134 일경우에 왼쪽 2자리 오른쪽 2자를 나누면 아래와 같습니다.
X좌표 : 211189 / Y좌표 : 124134
이렇게하면 커다란 좌표상에 하나의 고유한 점으로 표현 될 수 있는데, 화면상에 표현할 수 있는 수치의 한계가 있으므로 화면에 표현할 수 있는 크기인 크기만큼을 다시 조절해야하는데 저같은경우 화면 크기만큼 나누어 나머지를 좌표로 사용했습니다. 화면에 출력 가능한 영역이 512 * 512 일경우
X좌표 : 211189 % 512 = 245 / Y좌표 : 124134 % 512 = 230
이 됩니다. 원리는 알겠지만 이렇게 하면 중복되는 좌표가 발생할 수 밖에 없는데요, 이같은경우 Zoom기능을 추가하여 출력가능 범위를 적절하게 조절해주시면 충분히 고유한 위치를 표현 하실 수 있습니다.
그리고 해당 도메인의 방문 빈도수에 따라서 원으 크기가 달라지게 되며 해당 원에 마우스를 오버 할 경우 해당 페이지의 썸네일 이미지를 함께 보실 수 있습니다. 그리고 해당 도메인을 마우스로 클릭 할 경우 아래와 같이 해당 도메인에 포함된 페이지를 보실 수 있습니다.
소스코드를 블로그에서 일일이 설명을 하기엔 분량이 많아서 다루기 힘들지만, 아래에 소스코드를 다운로드받으셔서 살펴보신 뒤 궁금하신 점은 리플이나 메일로 질문 남겨주시면 답변해드리도록 하겠습니다.
P.S 급하게 구현한 내용이라 코드의 최적화는 되어있지 않으니 참고하시기 바랍니다..
WebLogBook.zip
