如何將「Google動態地圖」嵌入到部落格或網頁中？ - 重灌狂人

一、設定Google地圖位置、尺寸與工具列 · 1. 在「左邊的地圖」找到你要顯示的地點 · 2. 按〔Set Zoom〕按鈕（設定解析度） · 3. 按〔Set Center〕按鈕（設定 ... Skiptocontent 首頁 Windows Mac 手機App Android iPhone Office PDF 免費防毒軟體 語言學習 學英文 學日文 *錯誤回報 HOME»社群交友、社交網站»Google與其他Google應用 Postedon08-06,200711-03,2013 by不來恩         2007/8/24更新：GoogleMaps已開放「嵌入動態地圖」到自己的網頁 常常寫美食日誌或寫遊記的人，一定會常常需要將某個地點的的圖秀給你的讀者或朋友看，但一般情況下，， 可能只是抓個UrMap或GoogleMaps地圖的URL連結，讓大家連過去看。

再費工一點的話，頂多是把網路地圖抓張圖下來，貼在你的網站或BLOG上。

有沒有更方便的方法，可以將整個動態的網路地圖拉到自己的網站來顯示呢？ 有的！這下子真的有囉！以下介紹一個簡單好用的網路地圖工具，讓我們可以將自己選定的景點或地址嵌入到自己的網頁或BLOG上。

以後當你提到某的地點時，就可以直接讓網友在你的網站上像使用GoogleMaps一樣，用滑鼠拖、拉地圖，找找方向。

繼續閱讀   Google動態地圖範例：   以下介紹的這個網站，我猜他應該也是使用Google的「GoogleMapsAPI」來做的，該站站長將他弄成更簡單方便的介面後，一般使用者就可以直接按兩下滑鼠取得程式碼，並將Google動態地圖嵌入到任何網頁上。

不用再費心的搞一堆「GoogleMapsAPI」程式碼跟有的沒的東西，就算是不會寫程式的一般使用者，也可以輕易的在部落格上貼地圖唷。

網站名稱：EmbedGoogle‘MyMaps’ 網站網址：http://www.dr2ooo.com/tools/maps/ 在開始使用之前，先稍為介紹一下上面這個網站的大概用法。

他有兩種主要用法：第一種是將你要顯示的地點，設定好地圖位置與大小後，直接嵌入程式碼。

第二種方式可以讓我們先在GoogleMaps上建好自己的「我的地圖」，「我的地圖」裡面可以嵌入多個地點的說明、標題、劃線跟畫框區塊等等，方便網友們更快的找到方向或相關資料，聽說還可以加上Flickr照片等等（這我不確定唷）。

以下先介紹第一種較簡單的嵌入動態Google地圖的方法： 一、設定Google地圖位置、尺寸與工具列 操作方法其實很簡單，只要按照下面步驟做就可以囉： 設定步驟： 1.在「左邊的地圖」找到你要顯示的地點 2.按〔SetZoom〕按鈕（設定解析度） 3.按〔SetCenter〕按鈕（設定地圖中心點） 4.勾選「控制列」與「中心點標示」功能 5.設定地圖寬度與高度（Size） 6.將地圖程式碼貼到你的網站 第1步  首先，開啟「EmbedGoogle‘MyMaps’」網站，網站主要分兩個區塊，左邊的地圖是用來尋找地點用的，你可以在左邊地圖用滑鼠拖拉、放大或尋找你要的地點。

找到地點並按下定位按鈕後，右邊地圖就會變成跟左邊一模一樣的畫面，確認畫面無誤後，就可以使用右邊地圖下方的嵌入程式碼將地圖嵌入到你的網站中。

  第2步 如圖，我們可以在左邊地圖中拖拉地圖尋找你要的地點。

在部份情況下，你也可以用左下方的「AddressSearch」功能來尋找你要的地點，如輸入「世貿」，再按下〔Recenter〕按鈕，即可直接跳到台北101大樓旁邊的台北世貿。

（有些地點搜尋不到的話，請用手動的）   第3步  在左邊地圖找到你要的地點後，按一下〔SetZoom〕按鈕，完成「地圖解析度」的定位設定。

設定好之後，以後當使用者開啟該地圖時，便會自動顯示你指定的地圖解析度，不用一直拉遠或拉近（放大）來看。

  第4步  接著再按一下〔SetCenter〕按鈕，完成地圖中心點位置的設定。

設定好之後，以後當使用者開啟該地圖時，便會自動跳到你指定的那個地點，不用再花時間找路。

  第5步  接著我們可以勾選「MapControl」跟「MarkCenter」這兩個選項，「MapControl」就是地圖左上方的方向鍵與放大、縮小地圖的「+」跟「-」的工具列。

而「MarkCenter」就是幫你在地圖的中心點，也就是你指定的地址上放一個指標圖，方便網友更清楚的看到你指定的地點。

  第6步 最後，如果你想調整地圖呈現的大小的話，可以修改「Size」欄位中的數字，每做一次修改，都會直接顯示在右邊的地圖中，讓我們先行預覽製作完成的地圖樣貌。

確認無誤後，再複製「Code」方框中的程式碼，將這些程式碼貼上到你的網站或部落格中。

範例就如同本站最上方的那個Google動態地圖。

    二、將Google動態地圖嵌入到BLOG或網頁中 注意！目前測試無名小站、Yahoo!奇摩部落格均不支援「iframe」語法(其實也沒關係，有支援正妹跟美女圖就夠了…)，另外找到PIXNET（痞客幫）部落格服務可以支援，所以下面就用PIXNET部落格服務來示範。

第1步 登入你的部落格後，發表新文章時先將文章編輯器切換成一般編輯器（沒有笑臉圖示的那種），或者在進階編輯器中按一下〔原始碼〕按鈕，切換原始碼編輯模式來編輯文章。

  第2步 接著將剛剛的Google地圖程式碼貼上在文章中你想要顯示的地方，編輯好之後，再按下〔發表文章〕按鈕。

  第3步 如圖，你的文章中便會出現剛剛的地圖，地圖中會出現你指定的地點與標示。

更新： 另外一個更方便的嵌入地圖製造器： FreeMapGeneratorforyourHomepage ， 相關資訊 文章導覽 Prev關於iweb8.com虛擬主機CPUQuota的問題回覆Next如何「禁止」網站任意改變Firefox視窗大小？ 訪客留言： 25Repliesto“如何將「Google動態地圖」嵌入到部落格或網頁中？” Commentnavigation OlderComments較舊的 謝謝!把原本很複雜的事情都弄得這麼容易! 回覆 我想將公司的地圖以GOOGLEMAP的方式放到公司的網站中 不知道有沒有什麼使用權限的問題? 回覆 有email使用的方法嗎?剛試這個不行~ 回覆 我有一個免費的房地產租售張貼網站.要像這功能的地圖功能誰能幫忙(可付費) http://www.aihouse.com.tw/blog/king/這個頁面的電子地圖. 請跟我聯繫[email protected] 回覆 Commentnavigation OlderComments較舊的 發佈留言取消回覆發佈留言必須填寫的電子郵件地址不會公開。

必填欄位標示為*留言*顯示名稱 電子郵件地址 Searchfor: Search [下載]小紅傘Avira免費防毒軟體（繁體中文版） [下載][免費]Kaspersky卡巴斯基防毒軟體（繁體中文版） [統一發票]中獎號碼110年11、12月 LINE電腦版下載（Windows版、Mac版） Telegram繁體中文版下載（免費貼圖、免費打電話） 重要！如何防範勒索軟體綁架你的電腦、加密你的檔案、跟你要錢？ 人事行政總處2022行事曆、放假日(民國111 [免費下載]Windows10簡體/繁體中文版光碟映像(ISO檔案)官方網站正式版本 最新PotPlayer影音播放器繁體中文版下載 [Android模擬器]Genymotion超強100%完全模擬，在電腦中也能玩Android遊戲、App [免費][模擬器]BlueStacks免買手機、平板電腦，直接在電腦玩Android遊戲、APP 接收新文章通知 最新文章 「TodoPomo」結合待辦事項、15首背景音樂的線上番茄鐘 「Zine」加入各種障礙的一筆畫遊戲，超過10,000個謎題等著你！ 「WakeoutKids」專為0~5歲兒童設計的情境式運動App 「FunEscapeRoom」集結各種益智謎題的密室逃脫遊戲，任何人皆可輕鬆上手！ 練起來先！「日本旅遊實用句」旅日少女真人配音，情境句型豐富超實用！ 「NoxOcean」有趣的海底城鎮專注計時器，3種強度幫助告別拖延症！ ForvoPronunciation由母語人士提供的真人單字、詞句發音查詢工具 天氣冷冷的玩這個剛好！「Warmth」用火把取暖的益智遊戲 「Presently」可幫助記錄、學習感恩的日記App 「MathCards」適合國小學生的加、減、乘、除算術練習，可手寫答案！ WidgetWonder情境式桌面照片展示小工具 「Vía」超燒腦又好美的迷宮解謎遊戲 [限時免費]AllInOneMemo可錄音、錄影、加入照片、純文字的全能備忘錄 解放你的Ctrl+C！即選即複製！「CopyTextEasily」大量複製網頁文字的好幫手 「VellumWallpapers」每日更新！超高畫質的免費桌布App 全部文章分類 Android手機、平板 其他工具、Android未分類 好玩遊戲、休閒益智 影音播放、影視編輯 拍照攝影特效、繪圖 文書處理、編輯應用 桌面美化、介面增強 系統設定、功能調整 網路瀏覽、防毒軟體 美食旅遊、地圖服務 語言學習、教育閱讀 購物理財、生活應用 通訊、聊天社交服務 音樂播放、編輯轉檔 iPad,iPhone手機、平板 其他工具、未分類 好玩遊戲、休閒益智 影視播放、影音編輯轉檔 拍照攝影特效、繪圖工具 文書處理、辦公室應用 桌布美化、系統增強工具 系統設定、功能調整 網路瀏覽、防毒軟體 美食旅遊、地圖服務 語言學習、教育閱讀 購物理財、生活應用 通訊、聊天、社交服務 音樂播放、音樂編輯轉檔 Mac蘋果電腦 下載工具、P2P、FTP 好玩遊戲、休閒益智 影視編輯、轉檔播放軟體 文書編輯、PDF、字典 桌面美化、介面最佳化 檔案管理、壓縮備份還原 看圖軟體、繪圖、轉檔 磁碟管理、光碟燒錄 系統維護、設定工具 系統設定、功能調整 網路工具、郵件LINE即時通訊 蘋果電腦-未分類 防毒、防火牆、病毒檢測 音樂編輯、轉檔播放軟體 WindowsPhone Windows軟體、工具 Chrome,Firefox,IE,Opera瀏覽器 Email郵件收發、收信軟體 下載/上傳工具、P2P、FTP 即時通訊軟體 好玩遊戲、休閒益智 影視編輯、轉檔、影音播放軟體 文書編輯、PDF、Office、字典 桌面美化管理、介面最佳化 檔案管理、壓縮軟體、備份還原 生活應用、其他未分類 看圖軟體、繪圖、相片處理 磁碟管理、光碟燒錄 系統工具、快捷操作 系統設定、功能調整 網路工具、遠端遙控、連線監控 防毒軟體、防火牆、病毒檢測 音樂編輯、轉檔、音樂播放軟體 其他 Blog部落格 WordPress網站架設 硬體3C 網頁編修、網站架設 虛擬主機,VPS,伺服器租用 好用網站、網路免費資源 KUSO、創意、網路小遊戲 免費字型、桌布下載 免費空間、貼圖傳檔 各種產生器、製造機 線上服務、實用工具 線上繪圖、轉檔、文書編輯 線上音樂、影視娛樂 語言學習、教育閱讀 社群交友、社交網站 Facebook臉書 GooglePlus,Google+ Google與其他Google應用 Plurk噗浪 Twitter微網誌 YT 關魚專欄:關於好台