選單

Snazzy Maps 為 Google 地圖加入不同的顏色組合

Snazzy Maps 為 Google 地圖加入不同的配色組合

現在有許多網站、部落格會習慣將 Google Maps 嵌入網頁,用來指示位置,讓讀者可以透過 Google 地圖的功能查找路徑,不過 Google Maps 並不容易自訂,特別是你對於它的自訂程式碼不熟的話,假如地圖看起來跟網頁的風格有些差距,你可以透過一些自訂的程式碼來修改它的配色,讓它更符合你的網頁風格。

Snazzy Maps 就是一個提供 Google 地圖配色大全的網站,它挑選了許多設計師調整過後的 Google 地圖,使用者透過標籤來找到自己喜愛的 Google Maps 配色,將網站提供的程式碼複製過去,就能把地圖調整成你需要的配色。

Snazzy Maps 在每一個地圖頁面提供了下載簡易範例鏈結,運用它範例內的程式碼,稍做修改、調整就能將它使用於自己的網站。所有的配色皆是以 Creative Commons 授權,使用者可以免費下載、使用。

網站名稱:Snazzy Maps
網站鏈結:https://snazzymaps.com/

使用教學

Step 1

開啟 Snazzy Maps 網頁後,從首頁或以標籤方式查找你需要的地圖配色,點選後會開啟詳細資料,其中有包含說明、標籤跟 JavaScript Style Array 程式碼 ,如果你不知道要如何將地圖嵌入,可以點選 Download a simple example 來下載範例檔。

Snazzy Maps 為 Google 地圖加入不同的配色組合

Step 2

將範例網頁下載、開啟後,可以看到將樣式套用在 Google 地圖上的樣子,稍微研究一下程式碼,應該就知道要如何把 Google 地圖更改樣式、嵌入網站裡,其實是相當簡單的,如果有需要可以上 Snazzy Maps 尋找你需要的地圖樣式。

Snazzy Maps 為 Google 地圖加入不同的配色組合

分享本文