Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
geolocation & html5
Search
danny
September 28, 2012
Technology
120
0
Share
geolocation & html5
danny
September 28, 2012
More Decks by danny
See All by danny
網頁開發工具 草稿吧
danny
0
88
Other Decks in Technology
See All in Technology
AI時代に、 データアナリストがデータエンジニアに異動して
jackojacko_
0
170
「誰一人取り残されない」 AIエージェント時代のプロダクト設計思想 Product Management Summit 2026
mizushimac
1
3k
Oracle Exadata Database Service on Cloud@Customer X11M (ExaDB-C@C) サービス概要
oracle4engineer
PRO
2
8k
20260428_Product Management Summit_tadokoroyoshiro
tadokoro_yoshiro
15
18k
Oracle Cloud Infrastructure:2026年4月度サービス・アップデート
oracle4engineer
PRO
0
360
Modernizing Your HCL Connections Experience: Visual Report to chain, Profile Enhancements, and AI Integration
wannesrams
0
290
[Oracle TechNight#99] 生成AI時代のAI/ML入門 ~ AIとオラクルデータベースの関係 (前半)
oracle4engineer
PRO
2
230
AWS Transform CustomでIaCコードを自由自在に変換しよう
duelist2020jp
0
250
新卒エンジニア研修、ハンズオンの設計における課題と実践知/ #tachikawaany
nishiuma
2
130
需要創出(Chatwork)×供給(BPaaS) フライホイールとMoat 実行能力の最適配置とAI戦略
kubell_hr
0
2.1k
GitHub Copilot Dev Days
tomokusaba
0
150
AIと乗り切った1,500ページ超のヘルプサイト基盤刷新とさらにその先の話
mugi_uno
2
310
Featured
See All Featured
Optimizing for Happiness
mojombo
378
71k
How GitHub (no longer) Works
holman
316
150k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
1
240
Scaling GitHub
holman
464
140k
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
350
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
baasie
0
340
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.7k
How to Talk to Developers About Accessibility
jct
2
190
How to build an LLM SEO readiness audit: a practical framework
nmsamuel
1
730
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
10
1.2k
GitHub's CSS Performance
jonrohan
1032
470k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1.1k
Transcript
Geolocation and HTML5 葉永信 2012
outline • what is geolocation? • why geolocation? • how
geolocation? • geolocation application ◦ google map ◦ html5 • conclusion
what is geolocation? • 地理位置? ◦ 成大 ◦ 成大醫院 ◦
成大醫院醫學院 ◦ 成大醫院醫學院資訊室 ◦ 圖書館上方3樓
what is geolocation? • 必需要有標準的描述方式 ◦ 經緯度 • 經緯度就是絕對位置 •
唯一位置? • 地球是圓的嗎?
what is geolocation? • 其實你由Global Position System所取得的經緯 度 • 取決於你所使用的球體定義模型
• 所以, 台灣用的標準是? ◦ TWD67 ◦ TWD97 • 為什麼要定自己的標準?
what is geolocation? • 地球不是圓的 • 地圖是平的吧 • 那兩地間的距離如何計算? ◦
由成大醫院到本校區距離0度5分3秒? ◦ 這樣要怎麼使用呀 XD
what is geolocation? • 球體模型對映到平面地圖 ◦ 稱為投影 • 投影座標又有數種 ◦
橫麥卡托 ◦ 直麥卡托 ◦ 其它
what is geolocation? 1. 球體模型 2. 投影座標系統 3. 計算距離 4.
那麼常用的導航, 又要如何製作? a. 向左轉、向右轉 b. 現在速度 c. 還有多久到達 d. 路況
why geolocation? 1. 民生應用 a. 導航 b. 美食地圖 c. 綠色地圖
d. 房地產價值 2. 環境調查 a. 淹水點 b. 淹水深 c. 山崩範圍 d. 地震點 3. 軍事應用
how geolocation? • 怎麼收 a. 收訊號,GPS收進來是什麼格式? b. 硬體,序列阜、藍芽、網路來的? c. 電腦、手機、平板
• 怎麼存 a. 存資料 b. 點、線、面 c. 影像 d. 點雲
how geolocation? • 怎麼疊 a. 不同的資料來源 b. 不同球體模型 c. 不同投影系統
d. 不同格式 • 如何應用,用在那裡? a. 最多的應用, 我在那裡? b. 你在那裡? c. 怎麼到你那邊?
how geolocation? • 怎麼收? a. 只有比較好的GPS才能設定球體模型及投影系統 b. GPS由序列阜進來 i. 純文字資料
ii. 天空有幾個衛星 iii. 現在的經緯度(北緯23度3分4秒、東經121度4分6秒) c. wifi訊號? i. goeip? ii. google 收集的wifi訊號與位置?
how geolocation? • 怎麼存?(數化) a. 向量 i. 點、線、面 ii. kml、GML、SHP
b. 點陣 i. tif... c. 格網 i. 等間距xyz檔 ii. 等間距z, 2維或3維矩陣 d. 點雲 i. 不等間距xyz
how geolocation? • 怎麼疊? a. 轉換成統一座標 • 然後用軟體秀圖 a. ArcGIS
b. QGIS c. uDIG d. ... • 那如果自己寫的呢? a. dotSpatial b. mapwingis c. geotools d. ...
how geolocation? • 怎麼用? ex: a. 路線導航 i. 資料結構 ii.
電腦圖學 iii. 最短路徑 iv. 具權重最短路徑 v. 蟻行法、基因法、其它法 b. 植生指數計算NDVI
google map 1. how to using google map? a. javascript
& html b. google API i. get a google API key first 2. why google map is so fast? a. LOD(Level Of Detail) b. 影像金字塔
building your own google map • how to building your
own google map? ◦ MapServer ◦ GeoServer ◦ MapGuide Server ◦ ... • Open source implement ◦ OSM(OpenStreetMap) ◦ ...
HTML5 geolocation API function success(position) { alert(position.coords.latitude, position.coords.longitude); } function
error(msg) { alert(msg); } if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(success, error); } else { error('not supported'); }
HTML5 & iPad • 你將不用存取硬體 • 不需要管你用什麼球體模型 • 不需要轉換座標 •
不需要.... • 就可以輕鬆製作一張跟著你移動的地圖
conclusion • 更新頻率 • 向量圖 • 衛星影像圖 • 成本 •
資料程式約8:2