google map 改用 api方式嵌入

原因:幫客戶做網站,要嵌入英文版的地圖。原本先使用google map的嵌入語法。結果對方說我們看到的都是中文。雖然說只要對方語系會是英文就會自動轉,不過想說如果可以強迫轉英文是更好,客戶也比較沒得說嘴。所以就上網搜了一下。然後最近真的是覺得記憶退化嚴重,趁這次有做出來趕快紀錄一下,免得下次要用又要重來….

參考了這幾篇:

然後可以先比較一下google map平常提供的嵌入語法,是長這樣

<iframe src=”https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d3615.550013102598!2d121.5367189!3d25.015402!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0xec78966a3d7b4efc!2z5ZyL56uL6Ie654Gj5aSn5a2455Sf5ZG956eR5a246aSo!5e0!3m2!1szh-TW!2stw!4v1534244255311″ width=”600″ height=”450″ frameborder=”0″ style=”border:0″ allowfullscreen></iframe>

嵌入結果是這樣

API的嵌入語法則是長這樣

<iframe src=”https://www.google.com/maps/embed/v1/place?key=AIzaSyBOLwZNcRE9yn0-tythMMwX5OIkpEbpFWw&q=106台北市大安區舟山路237號(NTU Department of Life Science)&language=en” width=”600″ height=”450″ frameborder=”0″ style=”border:0″ allowfullscreen></iframe>

嵌入結果長這樣

參數說明: