给定一个位置的经度和纬度,如何知道该位置的有效时区?
在大多数情况下,我们正在寻找IANA/Olson时区id,尽管有些服务可能只返回UTC偏移量或其他一些时区标识符。详细信息请阅读时区标签信息。
给定一个位置的经度和纬度,如何知道该位置的有效时区?
在大多数情况下,我们正在寻找IANA/Olson时区id,尽管有些服务可能只返回UTC偏移量或其他一些时区标识符。详细信息请阅读时区标签信息。
当前回答
function jsonpRequest(url, data) { let params = ""; for (let key in data) { if (data.hasOwnProperty(key)) { if (params.length == 0) { params += "?"; } else { params += "&"; } let encodedKey = encodeURIComponent(key); let encodedValue = encodeURIComponent(data[key]); params += encodedKey + "=" + encodedValue; } } let script = document.createElement('script'); script.src = url + params; document.body.appendChild(script); } function getLocation() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition); } else { x.innerHTML = "Geolocation is not supported by this browser."; } } let lat_ini=[]; let lon_ini=[]; function showPosition(position) { lat_ini= position.coords.latitude; lon_ini= position.coords.longitude; } ////delay time between lines function sleep(ms) { return new Promise(resolve => setTimeout(resolve, ms)); } /////// function getGMT() { getfinalGMT() getLocation() async function sample() { await sleep(2000); let lat_str=lat_ini.toString(); let lng_str=" "+lon_ini.toString(); let url = "https://api.opencagedata.com/geocode/v1/json"; let data = { callback: "displayGMT", q: lat_str + lng_str, key: "fac4471073a347019196c1291e6a97d7" } jsonpRequest(url, data) } sample(); } let your_GMT=[]; function displayGMT(data) { your_GMT=(Number(data.results[0].annotations.timezone.offset_string)) console.log(your_GMT) } ///// function getfinalGMT() { let lat=document.getElementById("lat_id").value; let lng=document.getElementById("lng_id").value; let lat_str=lat.toString(); let lng_str=" "+lng.toString(); let url = "https://api.opencagedata.com/geocode/v1/json"; let data = { callback: "displayfinalGMT", q: lat + lng_str, key: "fac4471073a347019196c1291e6a97d7" } jsonpRequest(url, data) } let final_GMT=[]; function displayfinalGMT(data) { final_GMT=(Number(data.results[0].annotations.timezone.offset_string)) console.log(final_GMT) } /////clock const hourHand = document.querySelector('[data-hour-hand]') const minuteHand = document.querySelector('[data-minute-hand]') const secondHand = document.querySelector('[data-second-hand]') let dif_overall=[]; function setClock() { let gmt_diff=Number(your_GMT-final_GMT)/100 if (gmt_diff>12){ dif_overall=gmt_diff-12 } else{ dif_overall=gmt_diff } console.log(dif_overall) const currentDate = new Date() const secondsRatio = currentDate.getSeconds() / 60 const minutesRatio = (secondsRatio + currentDate.getMinutes()) / 60 const hoursRatio = (minutesRatio + currentDate.getHours() - dif_overall ) / 12 setRotation(secondHand, secondsRatio) setRotation(minuteHand, minutesRatio) setRotation(hourHand, hoursRatio) } function setRotation(element, rotationRatio) { element.style.setProperty('--rotation', rotationRatio * 360) } function activate_clock(){ setClock() setInterval(setClock, 1000) } *, *::after, *::before { box-sizing: border-box; } body { background: linear-gradient(to right, hsl(200, 100%, 50%), hsl(175, 100%, 50%)); display: flex; justify-content: center; align-items: center; min-height: 100vh; overflow: hidden; } .clock { width: 200px; height: 200px; background-color: rgba(255, 255, 255, .8); border-radius: 50%; border: 2px solid black; position: relative; } .clock .number { --rotation: 0; position: absolute; width: 100%; height: 100%; text-align: center; transform: rotate(var(--rotation)); font-size: 1.5rem; } .clock .number1 { --rotation: 30deg; } .clock .number2 { --rotation: 60deg; } .clock .number3 { --rotation: 90deg; } .clock .number4 { --rotation: 120deg; } .clock .number5 { --rotation: 150deg; } .clock .number6 { --rotation: 180deg; } .clock .number7 { --rotation: 210deg; } .clock .number8 { --rotation: 240deg; } .clock .number9 { --rotation: 270deg; } .clock .number10 { --rotation: 300deg; } .clock .number11 { --rotation: 330deg; } .clock .hand { --rotation: 0; position: absolute; bottom: 50%; left: 50%; border: 1px solid white; border-top-left-radius: 10px; border-top-right-radius: 10px; transform-origin: bottom; z-index: 10; transform: translateX(-50%) rotate(calc(var(--rotation) * 1deg)); } .clock::after { content: ''; position: absolute; background-color: black; z-index: 11; width: 15px; height: 15px; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%; } .clock .hand.second { width: 3px; height: 45%; background-color: red; } .clock .hand.minute { width: 7px; height: 40%; background-color: black; } .clock .hand.hour { width: 10px; height: 35%; background-color: black; } /* Background Styles Only */ @import url('https://fonts.googleapis.com/css?family=Raleway'); * { font-family: Raleway; } .side-links { position: absolute; top: 15px; right: 15px; } .side-link { display: flex; align-items: center; justify-content: center; text-decoration: none; margin-bottom: 10px; color: white; width: 180px; padding: 10px 0; border-radius: 10px; } .side-link-youtube { background-color: red; } .side-link-twitter { background-color: #1DA1F2; } .side-link-github { background-color: #6e5494; } .side-link-text { margin-left: 10px; font-size: 18px; } .side-link-icon { color: white; font-size: 30px; } <input type="text" id="lat_id" placeholder="lat"><br><br> <input type="text" id="lng_id" placeholder="lng"><br><br> <button class="text" onClick="getLocation()">Location</button> <button class="text" onClick="getGMT()"> GMT</button> <button class="text" onClick="activate_clock()"> Activate</button> <div class="clock"> <div class="hand hour" data-hour-hand></div> <div class="hand minute" data-minute-hand></div> <div class="hand second" data-second-hand></div> <div class="number number1">1</div> <div class="number number2">2</div> <div class="number number3">3</div> <div class="number number4">4</div> <div class="number number5">5</div> <div class="number number6">6</div> <div class="number number7">7</div> <div class="number number8">8</div> <div class="number number9">9</div> <div class="number number10">10</div> <div class="number number11">11</div> <div class="number number12">12</div> </div>
其他回答
如果你不想使用web服务,你可以像这样从浏览器中检索信息:
var d = new Date();
var usertime = d.toLocaleString();
//some browsers / OSs provide the timezone name in their local string
var tzsregex = /\b(ACDT|ACST|ACT|ADT|AEDT|AEST|AFT|AKDT|AKST|AMST|AMT|ART|AST|AWDT|AWST|AZOST|AZT|BDT|BIOT|BIT|BOT|BRT|BST|BTT|CAT|CCT|CDT|CEDT|CEST|CET|CHADT|CHAST|CIST|CKT|CLST|CLT|COST|COT|CST|CT|CVT|CXT|CHST|DFT|EAST|EAT|ECT|EDT|EEDT|EEST|EET|EST|FJT|FKST|FKT|GALT|GET|GFT|GILT|GIT|GMT|GST|GYT|HADT|HAEC|HAST|HKT|HMT|HST|ICT|IDT|IRKT|IRST|IST|JST|KRAT|KST|LHST|LINT|MART|MAGT|MDT|MET|MEST|MIT|MSD|MSK|MST|MUT|MYT|NDT|NFT|NPT|NST|NT|NZDT|NZST|OMST|PDT|PETT|PHOT|PKT|PST|RET|SAMT|SAST|SBT|SCT|SGT|SLT|SST|TAHT|THA|UYST|UYT|VET|VLAT|WAT|WEDT|WEST|WET|WST|YAKT|YEKT)\b/gi;
//in other browsers the timezone needs to be estimated based on the offset
var timezonenames = {"UTC+0":"GMT","UTC+1":"CET","UTC+2":"EET","UTC+3":"EEDT","UTC+3.5":"IRST","UTC+4":"MSD","UTC+4.5":"AFT","UTC+5":"PKT","UTC+5.5":"IST","UTC+6":"BST","UTC+6.5":"MST","UTC+7":"THA","UTC+8":"AWST","UTC+9":"AWDT","UTC+9.5":"ACST","UTC+10":"AEST","UTC+10.5":"ACDT","UTC+11":"AEDT","UTC+11.5":"NFT","UTC+12":"NZST","UTC-1":"AZOST","UTC-2":"GST","UTC-3":"BRT","UTC-3.5":"NST","UTC-4":"CLT","UTC-4.5":"VET","UTC-5":"EST","UTC-6":"CST","UTC-7":"MST","UTC-8":"PST","UTC-9":"AKST","UTC-9.5":"MIT","UTC-10":"HST","UTC-11":"SST","UTC-12":"BIT"};
var timezone = usertime.match(tzsregex);
if (timezone) {
timezone = timezone[timezone.length-1];
} else {
var offset = -1*d.getTimezoneOffset()/60;
offset = "UTC" + (offset >= 0 ? "+" + offset : offset);
timezone = timezonenames[offset];
}
//there are 3 variables can use to see the timezone
// usertime - full date
// offset - UTC offset time
// timezone - country
console.log('Full Date: ' + usertime);
console.log('UTC Offset: ' + offset);
console.log('Country Code Timezone: ' + timezone);
在我目前的情况下,它是打印:
日期:“27”/“01”/“2014”:“16”:“53”:“37” UTC偏移量:UTC-3 国家代码时区:BRT
希望对大家有所帮助。
从古比鱼:
import geocoders
g = geocoders.GoogleV3()
place, (lat, lng) = g.geocode('Fairbanks')
print place, (lat, lng)
Fairbanks, AK, USA (64.8377778, -147.7163889)
timezone = g.timezone((lat, lng))
print timezone.dst
美国/安克雷奇。DstTzInfo的dst
美国/主播LMT-1天,STD 1400:00
我写了一个包https://github.com/ringsaturn/tzf支持获取时区在Go&Python和非常快:
package main
import (
"fmt"
"github.com/ringsaturn/tzf"
)
func main() {
finder, err := tzf.NewDefaultFinder()
if err != nil {
panic(err)
}
fmt.Println(finder.GetTimezoneName(116.6386, 40.0786))
}
Python https://github.com/ringsaturn/tzfpy sample:
from tzfpy import get_tz
print(get_tz(121.4737, 31.2305))
Rust https://github.com/ringsaturn/tzf-rs样品:
use tzf_rs::DefaultFinder;
fn main() {
let finder = DefaultFinder::new();
print!("{:?}\n", DefaultFinder.get_tz_name(116.3883, 39.9289));
}
function jsonpRequest(url, data) { let params = ""; for (let key in data) { if (data.hasOwnProperty(key)) { if (params.length == 0) { params += "?"; } else { params += "&"; } let encodedKey = encodeURIComponent(key); let encodedValue = encodeURIComponent(data[key]); params += encodedKey + "=" + encodedValue; } } let script = document.createElement('script'); script.src = url + params; document.body.appendChild(script); } function getLocation() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition); } else { x.innerHTML = "Geolocation is not supported by this browser."; } } let lat_ini=[]; let lon_ini=[]; function showPosition(position) { lat_ini= position.coords.latitude; lon_ini= position.coords.longitude; } ////delay time between lines function sleep(ms) { return new Promise(resolve => setTimeout(resolve, ms)); } /////// function getGMT() { getfinalGMT() getLocation() async function sample() { await sleep(2000); let lat_str=lat_ini.toString(); let lng_str=" "+lon_ini.toString(); let url = "https://api.opencagedata.com/geocode/v1/json"; let data = { callback: "displayGMT", q: lat_str + lng_str, key: "fac4471073a347019196c1291e6a97d7" } jsonpRequest(url, data) } sample(); } let your_GMT=[]; function displayGMT(data) { your_GMT=(Number(data.results[0].annotations.timezone.offset_string)) console.log(your_GMT) } ///// function getfinalGMT() { let lat=document.getElementById("lat_id").value; let lng=document.getElementById("lng_id").value; let lat_str=lat.toString(); let lng_str=" "+lng.toString(); let url = "https://api.opencagedata.com/geocode/v1/json"; let data = { callback: "displayfinalGMT", q: lat + lng_str, key: "fac4471073a347019196c1291e6a97d7" } jsonpRequest(url, data) } let final_GMT=[]; function displayfinalGMT(data) { final_GMT=(Number(data.results[0].annotations.timezone.offset_string)) console.log(final_GMT) } /////clock const hourHand = document.querySelector('[data-hour-hand]') const minuteHand = document.querySelector('[data-minute-hand]') const secondHand = document.querySelector('[data-second-hand]') let dif_overall=[]; function setClock() { let gmt_diff=Number(your_GMT-final_GMT)/100 if (gmt_diff>12){ dif_overall=gmt_diff-12 } else{ dif_overall=gmt_diff } console.log(dif_overall) const currentDate = new Date() const secondsRatio = currentDate.getSeconds() / 60 const minutesRatio = (secondsRatio + currentDate.getMinutes()) / 60 const hoursRatio = (minutesRatio + currentDate.getHours() - dif_overall ) / 12 setRotation(secondHand, secondsRatio) setRotation(minuteHand, minutesRatio) setRotation(hourHand, hoursRatio) } function setRotation(element, rotationRatio) { element.style.setProperty('--rotation', rotationRatio * 360) } function activate_clock(){ setClock() setInterval(setClock, 1000) } *, *::after, *::before { box-sizing: border-box; } body { background: linear-gradient(to right, hsl(200, 100%, 50%), hsl(175, 100%, 50%)); display: flex; justify-content: center; align-items: center; min-height: 100vh; overflow: hidden; } .clock { width: 200px; height: 200px; background-color: rgba(255, 255, 255, .8); border-radius: 50%; border: 2px solid black; position: relative; } .clock .number { --rotation: 0; position: absolute; width: 100%; height: 100%; text-align: center; transform: rotate(var(--rotation)); font-size: 1.5rem; } .clock .number1 { --rotation: 30deg; } .clock .number2 { --rotation: 60deg; } .clock .number3 { --rotation: 90deg; } .clock .number4 { --rotation: 120deg; } .clock .number5 { --rotation: 150deg; } .clock .number6 { --rotation: 180deg; } .clock .number7 { --rotation: 210deg; } .clock .number8 { --rotation: 240deg; } .clock .number9 { --rotation: 270deg; } .clock .number10 { --rotation: 300deg; } .clock .number11 { --rotation: 330deg; } .clock .hand { --rotation: 0; position: absolute; bottom: 50%; left: 50%; border: 1px solid white; border-top-left-radius: 10px; border-top-right-radius: 10px; transform-origin: bottom; z-index: 10; transform: translateX(-50%) rotate(calc(var(--rotation) * 1deg)); } .clock::after { content: ''; position: absolute; background-color: black; z-index: 11; width: 15px; height: 15px; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%; } .clock .hand.second { width: 3px; height: 45%; background-color: red; } .clock .hand.minute { width: 7px; height: 40%; background-color: black; } .clock .hand.hour { width: 10px; height: 35%; background-color: black; } /* Background Styles Only */ @import url('https://fonts.googleapis.com/css?family=Raleway'); * { font-family: Raleway; } .side-links { position: absolute; top: 15px; right: 15px; } .side-link { display: flex; align-items: center; justify-content: center; text-decoration: none; margin-bottom: 10px; color: white; width: 180px; padding: 10px 0; border-radius: 10px; } .side-link-youtube { background-color: red; } .side-link-twitter { background-color: #1DA1F2; } .side-link-github { background-color: #6e5494; } .side-link-text { margin-left: 10px; font-size: 18px; } .side-link-icon { color: white; font-size: 30px; } <input type="text" id="lat_id" placeholder="lat"><br><br> <input type="text" id="lng_id" placeholder="lng"><br><br> <button class="text" onClick="getLocation()">Location</button> <button class="text" onClick="getGMT()"> GMT</button> <button class="text" onClick="activate_clock()"> Activate</button> <div class="clock"> <div class="hand hour" data-hour-hand></div> <div class="hand minute" data-minute-hand></div> <div class="hand second" data-second-hand></div> <div class="number number1">1</div> <div class="number number2">2</div> <div class="number number3">3</div> <div class="number number4">4</div> <div class="number number5">5</div> <div class="number number6">6</div> <div class="number number7">7</div> <div class="number number8">8</div> <div class="number number9">9</div> <div class="number number10">10</div> <div class="number number11">11</div> <div class="number number12">12</div> </div>
你可以使用geolocator.js轻松获得时区和更多…
它使用需要密钥的谷歌api。首先你配置geolocator
geolocator.config({
language: "en",
google: {
version: "3",
key: "YOUR-GOOGLE-API-KEY"
}
});
获取TimeZone,如果你有坐标:
geolocator.getTimeZone(options, function (err, timezone) {
console.log(err || timezone);
});
示例输出:
{
id: "Europe/Paris",
name: "Central European Standard Time",
abbr: "CEST",
dstOffset: 0,
rawOffset: 3600,
timestamp: 1455733120
}
定位,然后获得时区和更多
如果没有坐标,可以先定位用户位置。
下面的例子将首先尝试HTML5 Geolocation API来获取坐标。如果失败或被拒绝,它将通过Geo-IP查找获得坐标。最后,它将获得时区和更多…
var options = {
enableHighAccuracy: true,
timeout: 6000,
maximumAge: 0,
desiredAccuracy: 30,
fallbackToIP: true, // if HTML5 fails or rejected
addressLookup: true, // this will get full address information
timezone: true,
map: "my-map" // this will even create a map for you
};
geolocator.locate(options, function (err, location) {
console.log(err || location);
});
示例输出:
{
coords: {
latitude: 37.4224764,
longitude: -122.0842499,
accuracy: 30,
altitude: null,
altitudeAccuracy: null,
heading: null,
speed: null
},
address: {
commonName: "",
street: "Amphitheatre Pkwy",
route: "Amphitheatre Pkwy",
streetNumber: "1600",
neighborhood: "",
town: "",
city: "Mountain View",
region: "Santa Clara County",
state: "California",
stateCode: "CA",
postalCode: "94043",
country: "United States",
countryCode: "US"
},
formattedAddress: "1600 Amphitheatre Parkway, Mountain View, CA 94043, USA",
type: "ROOFTOP",
placeId: "ChIJ2eUgeAK6j4ARbn5u_wAGqWA",
timezone: {
id: "America/Los_Angeles",
name: "Pacific Standard Time",
abbr: "PST",
dstOffset: 0,
rawOffset: -28800
},
flag: "//cdnjs.cloudflare.com/ajax/libs/flag-icon-css/2.3.1/flags/4x3/us.svg",
map: {
element: HTMLElement,
instance: Object, // google.maps.Map
marker: Object, // google.maps.Marker
infoWindow: Object, // google.maps.InfoWindow
options: Object // map options
},
timestamp: 1456795956380
}