Google 在代码上使用 API 时,Place 的街景视图与 google 地图不同
Google Place's Street View is not the same as google maps when using API on code
我遇到了以下问题,
我正在尝试显示特定地点(bussiness/google 地点 ID)的街景视图,但我提供的结果与您转到 google 地图时的结果不同并搜索那个地方。
示例:
正在 google 搜索 Bussiness/Place:https://www.google.com.mx/maps/place/Adidas/@34.0838081,-118.3640503,17z/data=!4m12!1m6!3m5!1s0x80c2becbfdfa91f9:0xcc0878717da8381!2sAdidas!8m2!3d34.0840354!4d-118.3640653!3m4!1s0x80c2becbfdfa91f9:0xcc0878717da8381!8m2!3d34.0840354!4d-118.3640653?hl=es
通过 Places API 提取地点的位置,然后显示该位置的街景视图:
`
angular.module('plunker', ['ui.bootstrap', 'ngMap']).controller('MapDemoCtrl', ["$scope","NgMap",function ($scope, NgMap) {
var placeId = "ChIJ-ZH6_cu-woARgYPaF4eHwAw";
NgMap.getMap({id:'mapId'}).then(function(map){
var mapSV = map.getStreetView();
var placeS = new google.maps.places.PlacesService(map);
var streetS = new google.maps.StreetViewService();
placeS.getDetails({placeId:placeId},function(res){
console.log("Res",res);
var placeLocation = res.geometry.location;
map.setCenter(placeLocation);
mapSV.setPosition(placeLocation);
mapSV.setVisible(true);
window.place = res;
var marker = new google.maps.Marker({
position: placeLocation,
map: map,
title: "Place"
});
marker.addListener("click",function(ev){
console.log("dada",ev);
mapSV.setPosition(ev.latLng);
mapSV.setVisible(true);
})
});
})
}]);
`
https://plnkr.co/edit/H3ChFcmlQArCPfb2RCNI?p=preview
我预计会有与 google 地图显示相同的街景位置,但我得到的是另一个指向与业务无关的部分。如何获得正确的:
我在代码上添加了一个截图以供更多参考。
有时候我得到的是某家商家的室内街景,但显示的是隔壁商家的室内,因为我要找的不是街景,而是 google 地图而是显示正确的室外街景。
看起来 API 捕捉到最近的道路并显示该位置的街景图像。
您可以尝试使用 StreetViewService
搜索最佳可用全景图而不是最近的全景图。此外,您还可以过滤掉所有室内全景。
NgMap.getMap({id:'mapId'}).then(function(map){
var mapSV = map.getStreetView();
var placeS = new google.maps.places.PlacesService(map);
var streetS = new google.maps.StreetViewService();
placeS.getDetails({placeId:placeId},function(res){
console.log("Res",res);
var placeLocation = res.geometry.location;
map.setCenter(placeLocation);
var panoRequest = {
location: placeLocation,
preference: google.maps.StreetViewPreference.BEST,
source: google.maps.StreetViewSource.OUTDOOR
};
streetS.getPanorama(panoRequest, function(panoData, status){
if (status === google.maps.StreetViewStatus.OK) {
mapSV.setPosition(panoData.location.latLng);
mapSV.setVisible(true);
} else {
//Handle other statuses here
mapSV.setPosition(placeLocation);
mapSV.setVisible(true);
}
});
window.place = res;
var marker = new google.maps.Marker({
position: placeLocation,
map: map,
title: "Place"
});
marker.addListener("click",function(ev){
console.log("dada",ev);
mapSV.setPosition(ev.latLng);
mapSV.setVisible(true);
})
});
})
我修改了例子:https://plnkr.co/edit/6haMg7hTd4mI6qLpeF5U?p=preview
希望对您有所帮助!
我遇到了以下问题,
我正在尝试显示特定地点(bussiness/google 地点 ID)的街景视图,但我提供的结果与您转到 google 地图时的结果不同并搜索那个地方。
示例:
正在 google 搜索 Bussiness/Place:https://www.google.com.mx/maps/place/Adidas/@34.0838081,-118.3640503,17z/data=!4m12!1m6!3m5!1s0x80c2becbfdfa91f9:0xcc0878717da8381!2sAdidas!8m2!3d34.0840354!4d-118.3640653!3m4!1s0x80c2becbfdfa91f9:0xcc0878717da8381!8m2!3d34.0840354!4d-118.3640653?hl=es
通过 Places API 提取地点的位置,然后显示该位置的街景视图:
`
angular.module('plunker', ['ui.bootstrap', 'ngMap']).controller('MapDemoCtrl', ["$scope","NgMap",function ($scope, NgMap) {
var placeId = "ChIJ-ZH6_cu-woARgYPaF4eHwAw";
NgMap.getMap({id:'mapId'}).then(function(map){
var mapSV = map.getStreetView();
var placeS = new google.maps.places.PlacesService(map);
var streetS = new google.maps.StreetViewService();
placeS.getDetails({placeId:placeId},function(res){
console.log("Res",res);
var placeLocation = res.geometry.location;
map.setCenter(placeLocation);
mapSV.setPosition(placeLocation);
mapSV.setVisible(true);
window.place = res;
var marker = new google.maps.Marker({
position: placeLocation,
map: map,
title: "Place"
});
marker.addListener("click",function(ev){
console.log("dada",ev);
mapSV.setPosition(ev.latLng);
mapSV.setVisible(true);
})
});
})
}]);
`
https://plnkr.co/edit/H3ChFcmlQArCPfb2RCNI?p=preview
我预计会有与 google 地图显示相同的街景位置,但我得到的是另一个指向与业务无关的部分。如何获得正确的:
我在代码上添加了一个截图以供更多参考。
有时候我得到的是某家商家的室内街景,但显示的是隔壁商家的室内,因为我要找的不是街景,而是 google 地图而是显示正确的室外街景。
看起来 API 捕捉到最近的道路并显示该位置的街景图像。
您可以尝试使用 StreetViewService
搜索最佳可用全景图而不是最近的全景图。此外,您还可以过滤掉所有室内全景。
NgMap.getMap({id:'mapId'}).then(function(map){
var mapSV = map.getStreetView();
var placeS = new google.maps.places.PlacesService(map);
var streetS = new google.maps.StreetViewService();
placeS.getDetails({placeId:placeId},function(res){
console.log("Res",res);
var placeLocation = res.geometry.location;
map.setCenter(placeLocation);
var panoRequest = {
location: placeLocation,
preference: google.maps.StreetViewPreference.BEST,
source: google.maps.StreetViewSource.OUTDOOR
};
streetS.getPanorama(panoRequest, function(panoData, status){
if (status === google.maps.StreetViewStatus.OK) {
mapSV.setPosition(panoData.location.latLng);
mapSV.setVisible(true);
} else {
//Handle other statuses here
mapSV.setPosition(placeLocation);
mapSV.setVisible(true);
}
});
window.place = res;
var marker = new google.maps.Marker({
position: placeLocation,
map: map,
title: "Place"
});
marker.addListener("click",function(ev){
console.log("dada",ev);
mapSV.setPosition(ev.latLng);
mapSV.setVisible(true);
})
});
})
我修改了例子:https://plnkr.co/edit/6haMg7hTd4mI6qLpeF5U?p=preview
希望对您有所帮助!