Loading...

HTML5 Geolocation

Temperature: 0 °C

ChungChung
author_tools
說真的,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;
                            }}
                            );

Url link

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

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

https://innstory.com/story-HTML5_Geolocation-575

Prev
 那桌上其實已消逝的記憶

Next
多桑__李鴻欽漫畫 

Nearby Attractions

台北市內湖區江南街71巷75弄-Nearby Attractions

  • 白榕蔭堂墓園(白崇禧將軍墓) Go
  • 芳蘭大厝 Go
  • 士林神農宮(芝蘭廟) Go
  • 寶藏巖 Go
  • 殷海光故居 Go
  • 松山市場 Go

About the Author

Chung

我是chung
網路工作者
主業是網站系統開發建置
副業是做夢,寫故事
作品請參考/teme.biz
做夢請參考/innstory.com
聯絡/chung.teme@gmail.com

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

Visitor message

Leave some footprints to prove that you visited me

Recommended reading

Author's other related stories

Welcome To Google

Welcome To Google

Top第一天,參訪了Google APAC HQ 第一次來到Google,難掩興奮心情...

colorbox 使用 onclick href 驅動

colorbox 使用 onclick href 驅動

colorbox 一直都是很優秀的Lightbox外掛... 目前的網站中幾乎或多或少...

清除網頁暫存(no cache)

清除網頁暫存(no cache)

pexelsphoto 在製作專案時,有沒有試過JS 或 CSS 明明就已經更新了~ ...

Recommended reading

Other stories happened at this address

1歲6個多月,小小孩愛學大人樣~

1歲6個多月,小小孩愛學大人樣~

歲個多月,小小孩愛學大人樣~...

相簿功能導入

相簿功能導入

首先,非常感謝U今天肯給我個小時的時間。 讓我可以完成這個功能。 會想要這功能原因是我...

啊~是在拍我嗎?

啊~是在拍我嗎?

啊~是在拍我嗎?...

兄妹

兄妹

綠啊~爸爸在這裡幫妳做個紀錄,讓妳知道你哥哥是怎麼用他的方式來疼愛你的~ 這可是他最喜...

青椒炒肉絲佐高粱

青椒炒肉絲佐高粱

很簡單,卻也很下飯。 家裡買的沙茶也放了一陣子了,這晚就決定來盤沙茶口味的青椒炒肉絲。...

innstory首頁設計

innstory首頁設計

年,再次幫Innstory換上了新版的首頁。 這次使用了bootstrap RWD 設...

Please select an option

error

Hi, thank you for your participation, but you cannot vote repeatedly~

Join innstory now and start recording your story.

"Innstory" is a place to store stories. We are committed to becoming a warm platform. Deepening the bonds between people is our direction.
We are convinced that the blockchain between people is not just a cold calculation. Join us now.

Wrong format