国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

谷歌地圖 API 開發之新建地圖

Winer / 2271人閱讀

摘要：最近項目用到谷歌地圖，但是看谷歌文檔，對于國人來說，還是比較吃力的，網上找資料也并沒有太多的資料，所以就想分享給大家。顯示了整個地球地圖的完全縮放。

最近項目用到谷歌地圖，但是看谷歌api文檔，對于國人來說，還是比較吃力的，網上找資料也并沒有太多的資料，所以就想分享給大家。但是因為本人太懶了，每次研究技術完事時間一久就忘了，更別提分享了，在朋友的鼓勵支持之下，重新開始寫博客，共享給大家，如果有不到位或者錯誤的地方還希望大家多多指教。 畢竟交流才會進步(^o^)/~

好了，廢話不多說開始正題。

谷歌地圖官網：https://developers.google.com...
入門指南：https://developers.google.com...

好了，下面就貼一段簡單的案例代碼，入門指南里的

引入的js里需要一個秘鑰，現在引用的這個是可用的，如果想自己創建一個可以去官網里自己申請創建。

下面說下Google 地圖創建注意點：

1. 必須是用 聲明以 HTML5 形式聲明應用。

大多數瀏覽器使用 "標準模式" 的 HTML5 文檔渲染頁面，這就意味著你的應用是兼容各大瀏覽器的。

另外，如果沒有DOCTYPE標簽，瀏覽器則使用混雜模式 (quirks mode)進行渲染頁面內容。 提示： 應該注意的是一些"混雜模式"中的CSS并不能使用與標準模式中。在具體的應用中，所有基于百分比的大小都必須從父塊元素繼承 。如果在父模塊中沒有指定大小，默認值為 0 x 0 像素。如果你想使用百分比，可以在

請輸入代碼 這個樣式聲明表明地圖模塊的（GoogleMap）應 HTML高度為100%。

2. 添加 Google 地圖 API Key

將google生成的 API key 放置于 key 參數中(key=YOUR_API_KEY)。 The sensor 參數是必須的，該參數用于指明應用程序是否使用一個傳感器 (類似 GPS 導航) 來定位用戶的位置。參數值可以設置為 true 或者 false。

3. 地圖 DOM 元素

要想在網頁上顯示地圖，我們必須為其預留一個位置。我們通常的實現方式是：創建一個命名的 div 元素，然后在瀏覽器的文檔對象模型 (DOM) 中獲取對該元素的引用。

4. 創建一個 Map 對象

map = new google.maps.Map(document.getElementById("map"), {...});

表示地圖的 JavaScript 類是 Map 類。該類的對象定義頁面上的單個地圖。（您可以創建該類的多個實例–每個對象都將定義頁面上的一個不同地圖。）我們利用 JavaScript new 運算符來新建該類的實例。

當您新建地圖實例時，您需要在頁面中以地圖容器形式指定一個

HTML 元素。HTML 節點是 JavaScript document 對象的子項，我們通過 document.getElementById() 方法獲取對該元素的引用。

5. 定義地圖屬性

每個地圖都有兩個必需選項：center 和 zoom。還可以加上MapTypeId

map = new google.maps.Map(document.getElementById("map"), {
  center: {lat: -34.397, lng: 150.644},
  zoom: 8,
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

center（中心點）：中心屬性指定了地圖的中心，該中心通過坐標（緯度，經度）在地圖上創建一個中心點。

Zoom（縮放級數）：zoom 屬性指定了地圖的 縮放級數。zoom: 0 顯示了整個地球地圖的完全縮放。

MapTypeId（地圖的初始類型）：mapTypeId 屬性指定了地圖的初始類型。mapTypeId包括如下四種類型：

google.maps.MapTypeId.HYBRID：顯示衛星圖像的主要街道透明層

google.maps.MapTypeId.ROADMAP：顯示普通的街道地圖

google.maps.MapTypeId.SATELLITE：顯示衛星圖像

google.maps.MapTypeId.TERRAIN：顯示帶有自然特征（如地形和植被）的地圖

好了，上述基本都是從官網上貼來整理的，至此應該都能正常創建地圖了。

新手注意：

但是問題來了，因為當時做項目，項目比較大，而且時間很緊，有個細節當時沒注意，就是在寫js的過程中，函數命名必須要要有 initMap()，不然會報錯，提示 Uncaught InvalidValueError: initMap is not a function.

項目中有的地圖是需要點擊彈出地圖層的，點擊事件才要執行方法，然而每次都是自動執行，提示各種問題。百度谷歌了好久，答案紛飛，仍然毫無頭緒，然后又耐心從頭操作了一遍，看文檔，對，當看到引入的js的時候，里面有個&callback=initMap ，臥槽，大罵一句，放到這么不起眼的地方，這不坑人么。 這句話應該刪除的。

后來仔細想想，還是自己技術不夠扎實，如果沒有callback 這個js里的initMap() 又怎么會執行呢？

今天先寫這么多，明天寫下如何創建marker標記，記錄坐標位置，加油(^o^)/~

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/90853.html

相關文章

  • 谷歌地圖 API 開發之添加標記（解析以及補充）

    摘要：今天又看了下官網，發現官網上有地圖標記的詳細說明。請注意，上述方法并不會刪除該標記。查看示例也可以參考上一篇文章，谷歌地圖開發之添加標記其實跟官網的基本原理也是一樣的。表示該標記應該在原地彈跳。將自動調整圖標大小。 今天又看了下官網，發現官網上有地圖標記的詳細說明。當時居然眼瞎看不見，還琢磨了好久...#$%^&，一定是項目太急，沒看到(^o^)/~地址：https://develop...

    崔曉明 評論0 收藏0

  • 谷歌地圖 API 開發之添加標記

    摘要：創建地圖之后，基本上都需要標記位置的，就是那個圓點。然后參考谷歌的，找了許久，網址代碼如下創建對象地圖居中到當前坐標這段運行效果，就是你點擊地圖就會添加一個標記。 創建地圖之后，基本上都需要標記位置的，就是那個圓點。然后參考谷歌的API，找了許久，網址：https://developers.google.com... 代碼如下: Accessing arg...

    huaixiaoz 評論0 收藏0

  • 谷歌地圖 API 開發之信息窗口

    摘要：信息窗口具有一個內容區域和一個錐形柄。添加信息窗口構造函數采用了對象字面量，后者為顯示信息窗口指定了一組初始參數。其中包含此信息窗口錨定位置的。在標記上打開信息窗口將自動更新。用于指定信息窗口的最大寬度以像素為單位。 信息窗口 簡介 InfoWindow 在地圖上方給定位置的彈出窗口中顯示內容（通常為文本或圖像）。信息窗口具有一個內容區域和一個錐形柄。柄頂部與地圖上的某指定位置相連。 ...

    princekin 評論0 收藏0

發表評論

0條評論

最新活動
閱讀需要支付1元查看
<