資料載入中

我是 chung

鎖住記憶

  • Chung
  • 0°C
  • 10 年又 327 天

HTML5 Geolocation

說真的,HTML5 Geolocation的功能真的好用...

輕鬆就可以讓網站也能取得目前所在的地理位置

這次把它運用在innstory裡也是為了方便未來寫下動態或是故事,必竟住址比較不是那麼容易記下...

索性就把這工作交給系統~
<script>
var x = document.getElementById("demo");
function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
    } else {
        x.innerHTML = "Geolocation is not supported by this browser.";
    }
}
function showPosition(position) {
    x.innerHTML = "Latitude: " + position.coords.latitude +
    "<br>Longitude: " + position.coords.longitude;
}
</script>

上述function只是取得座標位置,若要將座標轉換成地址還得靠下列function
var geocoder = new google.maps.Geocoder();
                    geocoder.geocode({ location: new google.maps.LatLng(lat, lng) },
                    function (results, status) {
                        if (status == google.maps.GeocoderStatus.OK) {
                            document.getElementById("address_guest").value =results[0].formatted_address;
                            }}
                            );

連結網址

昨晚已把這功能也加入了innstory。

台北市內湖區江南街71巷75弄 Go

  • HTML5 Geolocation 功能應用
  • 網站取得地理位置的便利性
  • 將座標轉換成地址的技術
  • 在innstory中運用地理位置
  • 記錄動態故事的地理資訊
https://innstory.com/story-HTML5Geolocation-575

上一篇
 那桌上其實已消逝的記憶

下一篇
多桑李鴻欽(漫畫) 

發表留言

  • 蔡羽庭

    聽起來這功能真的挺實用的,解決了很多麻煩呢!
    2026-10-06 上午 5 點回覆

作者簡介

我是chung,網路工作者

主業是網站系統開發建置
副業是做夢、紀錄故事
作品請參考:teme.biz
做夢請參考:innstory.com
聯絡:chung.teme@gmail.com

有人用筆寫日記,有人用歲月寫日記,有人用照片寫日記,而我,用innstory寫日記。


推薦閱讀

作者其他相關類別故事

IE10 在 fckeditor無正常顯示及無法輸入任何字元

IE10 在 fckedit…

Chung 13 年又 83 天 3.2K

於fckorcodeie.js 檔案中, 在B.open(‘GET’, A, false); 及 ...

querySelectorAll對多個相同ID做統一處理

querySelectorA…

Chung 9 年又 68 天 4.3K

範例,想將同一組ID的DIV做統一隱藏的動作 我知道使用重複ID並不好,但我目前就遇到這樣的情況...

我很滿意這樣的分數

我很滿意這樣的分數

Chung 2026-01-14 下午 5 點 835

期末考結束,5G回家的路上跟我分享她今天的數學考了92分。 但我得到了一個蘋果,她說。 我問:「為...


推薦閱讀

這個地址也發生了其他故事

5U脫逃記,哥要的是自由啊

5U脫逃記,哥要的是自由啊

Chung 9 年又 271 天 2.5K

Mandy為了小傢伙添購了一個籠(安全柵欄)。 也在我充滿設計感的眼光下拼裝完成~ 為的是希望5U能...

10個月的5U,吃個飯像大爺啊

10個月的5U,吃個飯像大爺…

Chung 9 年又 268 天 2.6K

5U十個月了。 充滿好奇心的年紀,雖然會認人了,但試驗了幾次之後似乎不怎麼怕生。 不挑食,連尿布...

酸辣過癮的東炎泡飯

酸辣過癮的東炎泡飯

Chung 9 年又 267 天 2.2K

午餐,弄了一碗東炎泡飯嚐嚐~ 用的是Mandy昨晚用醬料包煮的東炎湯。 當然還加了不少海鮮,鮮蝦...


附近景點

這個地址-台北市內湖區江南街71巷75弄-附近還有甚麼?

  • 草山教師研習中心
  • 監察院
  • 林秀俊墓
  • 曹洞宗大本山臺灣別院鐘樓
  • 蔣中正宋美齡士林官邸
  • 台灣總督府交通局鐵道部(廳舍、八角樓男廁、戰時指揮中心、工務室、電源室、食堂)