我正在使用Google Maps API和Foursquare API构建一个React应用。我目前有Foursqaure的搜索中心,它被硬编码为ll: "36.04,-86.74",
,然后在componentDidMount
的更深处有console.log(
纬度:$ {crd.latitude}长度:$ {crd.longitude} );
正在从用户位置获取延迟。
如何将用户位置传递给ll
,而不是硬编码?
下面的代码是文件的这一部分,请让我知道我是否应该粘贴/发布其他内容/或回购链接(我认为这足够了)。
// Search query to Foursquare API
searchVenues = (query, limit) => {
SquareAPI.search({
ll: "36.04,-86.74", // Needs to be lat lng from user geo
// ll: {lat: crd.latitude, lng: crd.longitude}, // doesn't work
query: query,
limit: limit
}).then(res => {
const { venues } = res.response;
const center = { lat: 36.04, lng: -86.74 }; // this also needs to be lat lng from user geo (?)
const markers = venues.map(venue => {
return {
lat: venue.location.lat,
lng: venue.location.lng,
isOpen: false,
isVisible: true,
id: venue.id
};
})
this.setState({ venues, center, markers });
// Error for foursquare API call failure
}).catch(error => {
// pass error message(s) to handelError()
this.handleError(error)
})
}
// After mount of App component
componentDidMount() {
// Pass these into Foursquare search query above
this.searchVenues("juice+coffee", "25");
// Geolocation snippet based on MDN's example
const options = {
enableHighAccuracy: true,
timeout: 5000,
maximumAge: 0
};
// Success function for current position
const success = (pos) => {
const crd = pos.coords;
console.log('Your current position is:');
console.log(`Lat: ${crd.latitude} Lng: ${crd.longitude}`);
this.setState({ center: { lat: crd.latitude, lng: crd.longitude } })
this.setState({ defualtCenter: { lat: crd.latitude, lng: crd.longitude } })
}
function error(err) {
console.warn(`ERROR(${err.code}): ${err.message}`);
}
navigator.geolocation.getCurrentPosition(success, error, options);
}