|
直接下載 pdf 版本教程？登陸零點(diǎn)世界（ling.world） 1.1 什么是 Google Maps API?
就像我們所了解的那樣，Google并沒有開源自己的地圖信息。但是通過Google Maps API, 用戶可以把帶有定位信息的Google 地圖嵌入到外部的網(wǎng)站上。目前，超過百萬的網(wǎng)站都在通過Google Maps API來提取Google 地圖，成為市面上最受歡迎的網(wǎng)頁開發(fā)API。
Google Maps API 使用了JavaScript，使用戶可以通過簡單的代碼就能從Goolge 服務(wù)器里調(diào)換出地圖到自己的網(wǎng)站里。這個(gè)章節(jié)會展示自定義地圖制作、分析GIS地圖以及從Google maps到CAD轉(zhuǎn)換的整個(gè)流程。就像我在上面提及的那樣，這個(gè)方法會涉及到一些代碼操作。但，請不要因?yàn)樽约簭臎]學(xué)過編程而猶豫或困難，只要認(rèn)真的，一步步跟隨教程內(nèi)容，你也能很容易的做出來！ 1.2 自定義 Google Maps
首先，我們先從自定義地圖的制作開始。Google Maps API styled map wizard使我們可以編輯地圖圖層和對象，以及根據(jù)我們自定義的題圖當(dāng)中生成API代碼。 界面
只有兩個(gè)編輯面板用于自定義地圖。
我們以美國波士頓為例，制作一張道路分析圖。
您可以在右上角的搜索窗上搜索或者放大移動(dòng)來定位到想要的區(qū)位。 Google map默認(rèn)開啟了所有的對象和元素。這里，我們只需要道路系統(tǒng)，所以我們要關(guān)閉隱藏除了道路意外的所有對象與元素。為此，我們先關(guān)閉所有對象組，讓界面成為空白界面，然后新建一個(gè)圖層，僅開啟顯示道路對象組。
1. 點(diǎn)擊 Add，新建圖層。您不能在同一個(gè)圖層里賦予兩種顯示模式。 2. 選擇 Road >Highway 對象組來選擇道路層級下的高速公路。 3. 選擇 Geometry > Fill 來選擇圖形填充。 4. 點(diǎn)擊開啟顯示對象組和元素。 5. 更改編輯個(gè)性化顏色。
我們可通過打開水域來定義陸地邊界。
最終，打開注釋來完成波士頓道路分析圖。 Google Maps API styled map wizard的操作非常容易，所有的對象和元素都有序的組織在一起。您可以嘗試每一個(gè)對象組合元素來制作出您自己的地圖或分析圖。 下面的幾個(gè)也是用Google Maps API styled map wizard自定義出來的幾個(gè)案例。
美國州區(qū)域圖
美國東岸高速公路鏈接圖
美國曼哈頓建筑輪廓
美國曼哈頓第五大街區(qū)域使用狀態(tài) 1.3 生成和編輯 JSON 代碼 JSON 的全稱為 JavaScript Object Notation，是一種用可讀的文本代碼組成的開放標(biāo)準(zhǔn)格式。 在這個(gè)章節(jié)，我們通過生成JSON代碼來編輯其地圖畫幅大小，為后面的步驟準(zhǔn)備一張比較大分辨率的地圖。
需要注意的是，這個(gè)生成出來的JSON代碼不是一個(gè)完整的代碼程序。完整的JavaScript包含服務(wù)器地址，坐標(biāo)地址，輸出大小，地圖選項(xiàng)等必要信息。Google 開發(fā)者頁面包含很多案例代碼，我們只需要在那個(gè)基礎(chǔ)上稍微做點(diǎn)調(diào)整就可以。 進(jìn)到Google開發(fā)者頁面，找一個(gè)案例代碼。 https://developers.google.com/maps/documentation/javascript/examples/
在這里例子里，我們可以用簡單樣式地圖案例。在樣式菜單里點(diǎn)擊Simple styled maps，或者直接進(jìn)入以下網(wǎng)頁。 https://developers.google.com/maps/documentation/javascript/examples/maptype-styled-simple
Google的開發(fā)者提供了兩種代碼，一種是JavaScript，另一種是JavaScript HTML code。在這個(gè)例子里，我們要制作HTML格式的文件，用其瀏覽和儲存地圖。
用瀏覽器打開從記事本保存好的HTML文件（特別建議用Firefox瀏覽器，此瀏覽器的截圖插件比較好）。幾秒鐘的等待后，您可以通過右側(cè)和下側(cè)的滾軸瀏覽到大畫幅地圖。
1.4 另存為高分辨率 JPEG 文件 為了保存成高分辨率JPEG文件，建議用Firefox瀏覽器的Screengrab插件。Screengrab插件使用戶截取瀏覽器的全畫幅頁面存成JPEG文件，包括顯示器畫幅以外的內(nèi)容。
Firefox: https://www.mozilla.org/en-US/firefox/new/?src=amo Screengrab : https://addons.mozilla.org/en-US/firefox/addon/screengrab/
● Screengrab > save > Complete Page/Frame. 保存為JPEG格式。
1.5 從Google maps創(chuàng)建 .dwg 格式矢量地圖 在這個(gè)章節(jié)，我們會通過高分辨率Google maps創(chuàng)建dwg格式的矢量地圖。 首先，我們需要單獨(dú)的創(chuàng)建和保存地圖對象。以美國曼哈頓為例，根據(jù)上面所提到的步驟分別創(chuàng)建建筑對象、水域?qū)ο?、高速公路對象、區(qū)域公路對象以及道路。
以區(qū)域路（Local Road)為例，制作一張dwg格式的地圖。首先用Photoshop來創(chuàng)建地圖路徑。
對其他四個(gè)對象JPEGs文件做同樣的操作。然后，整合所有的DWG文件到一個(gè)文件。
畢竟這個(gè)操作流程是使JPEG格式的位圖轉(zhuǎn)換成矢量圖，因此線形不會非常的精確。盡管如此，這個(gè)方法在項(xiàng)目前期階段能起到事半功倍的作用。 下載整冊 pdf 版本教程，請登陸網(wǎng)址 www.ling.world |
|
|
