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

資訊專(zhuān)欄INFORMATION COLUMN

谷歌地圖 API 開(kāi)發(fā)之新建地圖

Winer / 2268人閱讀

摘要：最近項(xiàng)目用到谷歌地圖，但是看谷歌文檔，對(duì)于國(guó)人來(lái)說(shuō)，還是比較吃力的，網(wǎng)上找資料也并沒(méi)有太多的資料，所以就想分享給大家。顯示了整個(gè)地球地圖的完全縮放。

最近項(xiàng)目用到谷歌地圖，但是看谷歌api文檔，對(duì)于國(guó)人來(lái)說(shuō)，還是比較吃力的，網(wǎng)上找資料也并沒(méi)有太多的資料，所以就想分享給大家。但是因?yàn)楸救颂珣辛耍看窝芯考夹g(shù)完事時(shí)間一久就忘了，更別提分享了，在朋友的鼓勵(lì)支持之下，重新開(kāi)始寫(xiě)博客，共享給大家，如果有不到位或者錯(cuò)誤的地方還希望大家多多指教。 畢竟交流才會(huì)進(jìn)步(^o^)/~

好了，廢話(huà)不多說(shuō)開(kāi)始正題。

谷歌地圖官網(wǎng)：https://developers.google.com...
入門(mén)指南：https://developers.google.com...

好了，下面就貼一段簡(jiǎn)單的案例代碼，入門(mén)指南里的

引入的js里需要一個(gè)秘鑰，現(xiàn)在引用的這個(gè)是可用的，如果想自己創(chuàng)建一個(gè)可以去官網(wǎng)里自己申請(qǐng)創(chuàng)建。

下面說(shuō)下Google 地圖創(chuàng)建注意點(diǎn)：

1. 必須是用 聲明以 HTML5 形式聲明應(yīng)用。

大多數(shù)瀏覽器使用 "標(biāo)準(zhǔn)模式" 的 HTML5 文檔渲染頁(yè)面，這就意味著你的應(yīng)用是兼容各大瀏覽器的。

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

請(qǐng)輸入代碼 這個(gè)樣式聲明表明地圖模塊的（GoogleMap）應(yīng) HTML高度為100%。

2. 添加 Google 地圖 API Key

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

3. 地圖 DOM 元素

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

4. 創(chuàng)建一個(gè) Map 對(duì)象

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

表示地圖的 JavaScript 類(lèi)是 Map 類(lèi)。該類(lèi)的對(duì)象定義頁(yè)面上的單個(gè)地圖。（您可以創(chuàng)建該類(lèi)的多個(gè)實(shí)例–每個(gè)對(duì)象都將定義頁(yè)面上的一個(gè)不同地圖。）我們利用 JavaScript new 運(yùn)算符來(lái)新建該類(lèi)的實(shí)例。

當(dāng)您新建地圖實(shí)例時(shí)，您需要在頁(yè)面中以地圖容器形式指定一個(gè)

HTML 元素。HTML 節(jié)點(diǎn)是 JavaScript document 對(duì)象的子項(xiàng)，我們通過(guò) document.getElementById() 方法獲取對(duì)該元素的引用。

5. 定義地圖屬性

每個(gè)地圖都有兩個(gè)必需選項(xiàng)：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（中心點(diǎn)）：中心屬性指定了地圖的中心，該中心通過(guò)坐標(biāo)（緯度，經(jīng)度）在地圖上創(chuàng)建一個(gè)中心點(diǎn)。

Zoom（縮放級(jí)數(shù)）：zoom 屬性指定了地圖的 縮放級(jí)數(shù)。zoom: 0 顯示了整個(gè)地球地圖的完全縮放。

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

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

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

google.maps.MapTypeId.SATELLITE：顯示衛(wèi)星圖像

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

好了，上述基本都是從官網(wǎng)上貼來(lái)整理的，至此應(yīng)該都能正常創(chuàng)建地圖了。

新手注意：

但是問(wèn)題來(lái)了，因?yàn)楫?dāng)時(shí)做項(xiàng)目，項(xiàng)目比較大，而且時(shí)間很緊，有個(gè)細(xì)節(jié)當(dāng)時(shí)沒(méi)注意，就是在寫(xiě)js的過(guò)程中，函數(shù)命名必須要要有 initMap()，不然會(huì)報(bào)錯(cuò)，提示 Uncaught InvalidValueError: initMap is not a function.

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

后來(lái)仔細(xì)想想，還是自己技術(shù)不夠扎實(shí)，如果沒(méi)有callback 這個(gè)js里的initMap() 又怎么會(huì)執(zhí)行呢？

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

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/90853.html

相關(guān)文章

  • 谷歌地圖 API 開(kāi)發(fā)之添加標(biāo)記（解析以及補(bǔ)充）

    摘要：今天又看了下官網(wǎng)，發(fā)現(xiàn)官網(wǎng)上有地圖標(biāo)記的詳細(xì)說(shuō)明。請(qǐng)注意，上述方法并不會(huì)刪除該標(biāo)記。查看示例也可以參考上一篇文章，谷歌地圖開(kāi)發(fā)之添加標(biāo)記其實(shí)跟官網(wǎng)的基本原理也是一樣的。表示該標(biāo)記應(yīng)該在原地彈跳。將自動(dòng)調(diào)整圖標(biāo)大小。 今天又看了下官網(wǎng)，發(fā)現(xiàn)官網(wǎng)上有地圖標(biāo)記的詳細(xì)說(shuō)明。當(dāng)時(shí)居然眼瞎看不見(jiàn)，還琢磨了好久...#$%^&，一定是項(xiàng)目太急，沒(méi)看到(^o^)/~地址：https://develop...

    崔曉明 評(píng)論0 收藏0

  • 谷歌地圖 API 開(kāi)發(fā)之添加標(biāo)記

    摘要：創(chuàng)建地圖之后，基本上都需要標(biāo)記位置的，就是那個(gè)圓點(diǎn)。然后參考谷歌的，找了許久，網(wǎng)址代碼如下創(chuàng)建對(duì)象地圖居中到當(dāng)前坐標(biāo)這段運(yùn)行效果，就是你點(diǎn)擊地圖就會(huì)添加一個(gè)標(biāo)記。 創(chuàng)建地圖之后，基本上都需要標(biāo)記位置的，就是那個(gè)圓點(diǎn)。然后參考谷歌的API，找了許久，網(wǎng)址：https://developers.google.com... 代碼如下: Accessing arg...

    huaixiaoz 評(píng)論0 收藏0

  • 谷歌地圖 API 開(kāi)發(fā)之信息窗口

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

    princekin 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<