• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
121 벡터기반 지하철 노선도 렌더링 엔진
 

121 벡터기반 지하철 노선도 렌더링 엔진

on

  • 1,874 views

 

Statistics

Views

Total Views
1,874
Views on SlideShare
896
Embed Views
978

Actions

Likes
0
Downloads
32
Comments
0

4 Embeds 978

http://deview.kr 975
http://deview.admin.nhn.com 1
http://local.deview.kr 1
https://m.facebook.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    121 벡터기반 지하철 노선도 렌더링 엔진 121 벡터기반 지하철 노선도 렌더링 엔진 Presentation Transcript

    • 벡터기반 지하철 노선도 렌더링 엔진 안덕용 과장 / 지도앱 개발팀 Naver
    • CONTENTS 1.SVG to Model Data
    •    2.Vector Rendering Engine
    •    3.Q&A
    •    
    •    
    •   
    • 1. SVG to Model Data
    • 1.1 Intro
    • 1.1 Intro
    • 1.1 Intro
    • 1.2 벡터 개발의 시작
    • 1.3 벡터 데이터 포멧 Easy for Designer 1. 많은 사람들이 사용하는 벡터 디자인 툴을 이용해서 쉽게 디자인 할 수 있어야 할 것 2. 디자이너가 각 벡터 오브젝트에 이름을 쉽게 명시 할 수 있을 것 Easy for Programmer 1. File Import 및 개발하기 편해야 할 것 2. 쉽게 디버깅이 가능해야 할 것 AI CDR CGM DXF EVA EMF Gerber HVIF IGES PGML Designer Easy SVG VML WMF Xar Programmer
    • 1.3 벡터 데이터 포멧 SVG(Scalable Vector Graphic) : XML 기반
    • 1.3 벡터 데이터 포멧 SVG(Scalable Vector Graphic) : XML 기반 1. 지하철과 같이 복잡한 SVG에 적합한 오픈 소스가 없다 2. 필요한 데이타만 Import
    • 1.3 벡터 데이터 포멧 SVG(Scalable Vector Graphic) : XML 기반 1. 지하철과 같이 복잡한 SVG에 적합한 오픈 소스가 없다 2. 필요한 데이타만 Import Element 지하철 노선 비고 path line polyline polygon rect 지하철 역 circle 역 좌표 text 역 이름
    • 1.4 모델 데이터 만들기 SVG File Model Data 1. Rendering Data (호선별 전체 라인) 2. Meta Data (호선별 구간 라인, 지하철 역) SVG File Rendering Data VM 2 Meta Data
    • 1.4 모델 데이터 만들기 호선별 전체 라인 호선별
    •   구간
    •   라인
    •    지하철
    •   역
    •   
    • 1.4 모델 데이터 만들기 SVG File Data Model 호선별 전체 라인 렌더링 데이터 호선별 구간 라인 메타 데이터 지하철역
    • 1.4 모델 데이터 만들기 SVG File Server Data 호선별 구간 라인 위경도 좌표 Data Model 메타 데이터 지하철역 지하철 역 이름 / ID
    • 1.4 모델 데이터 만들기 SVG Processer SVG File Server Data Data Model 호선별 전체 라인 위경도 좌표 렌더링 데이터 최적화 지하철 역 이름 / ID 메타 데이터 호선별 구간 라인 지하철역
    • 1.5 모델 데이터 자동화 SVG File Meta Data 호선별 전체 라인 지하철역 정보 호선별 구간 라인 노선 구간 정보 지하철역 Server Data 위경도 좌 표 지하철 역 이름 / ID SVG Processor Rendering 렌더링 최적화
    • 1.5 모델 데이터 자동화 IOS Android WEB
    • 2. Vector Rendering Engine
    • 2.1 Vector Rendering Engine 대표적인 지하철 노선도 렌더링 방식 Tile Bitmap One Bitmap
    • 2.1 Vector Rendering Engine Bitmap Rendering 1. 서버를 통해 Bitmap을 받아오거나, Bitmap을 저장할 공간이 필요하다 2. 해상도에 따라 이미지 뭉개짐 3. 렌더링이 빠르다 Full Vector Rendering 1. 적은 용량의 벡터 데이터만 있으면 된다 2. 해상도에 전혀 상관이 없다 3. 렌더링이 느리다 Bitmap Rendering Based On Vector Model 1. 적은 용량의 벡터 데이터만 있으면 된다 2. 해상도에 따라 이미지 뭉개짐이 덜하다 3. 렌더링이 빠르다
    • 2.1 Vector Rendering Engine 지하철 노선도 렌더링 방식 : 벡터 타일 방식 Rendering Vector Data
    • 2.1 Vector Rendering Engine 지하철 노선도 렌더링 방식 : 벡터 타일 방식 Rendering Vector Data
    • 2.1 Vector Rendering Engine 지하철 노선도 렌더링 방식 : 벡터 타일 방식
    • 2.1 Vector Rendering Engine 지하철 노선도 렌더링 방식 : 벡터 타일 방식 장점 1. 적은 용량의 벡터 데이터만 있으면 된다 2. 해상도에 따라 이미지 뭉개짐이 덜하다 3. 렌더링이 빠르다 4. 화면에 보이지 않는 타일은 로딩되지 않는다 단점 1. 벡터 데이터로 타일을 하나를 만들때 소요되는 시간이 기기별로 틀리다.
    • 2.1 Vector Rendering Engine Vector Model to Bitmap Tile
    • 2.1 Vector Rendering Engine Vector Model to Bitmap Tile : SVGRenderer
    • 2.2 Bitmap Tile Cache SoftReference / WeekReference Cache 1. Android 2.3(API9) : SoftReference / WeekReference GC 빈번 2. 즉, StrongReference 가 사라지면 바로 GC 대상 LruCache 1. LruCache는 LinkedHashMap에 의해 StrongReference 유지 2. Cache에 사용할 메모리 사이즈를 지정 (지정된 메모리 사이즈가 넘을 시, Hit가 되지 않는 것들은 제거 3. Support Library 4. http://developer.android.com/training/displaying-bitmaps/cache-bitmap.html
    • 2.2 Bitmap Tile Cache Bitmap Tile Cache : Use LRU Cache Strong Reference LRU Cache
    • 2.2 Bitmap Tile Cache Bitmap Tile Cache : Use LRU Cache New Strong Reference LRU Cache 로 이동
    • 2.2 Bitmap Tile Cache Bitmap Tile Cache : Use LRU Cache 1. LRUCacheSize < Memory : Tile 제거 2. OOM 발생시 - LRUCache clear - Bitmap.Config.RGB_565 변경
    • 2.2 Bitmap Tile Cache Bitmap Tile Cache : Use LRU Cache
    • 2.2 Bitmap Tile Cache Bitmap Tile Cache : Use LRU Cache
    • 2.3 The End
    • Q&A
    • THANK YOU