Angular Google 地图中的 3D 地图可视化
3D map visualization in Angular Google Maps
前言
我正在使用 Angular Google Maps 来指示校园内不同建筑物的位置。我的初始化过程如下:
$scope.map = {
control: {},
center:
{
latitude: $scope.Item.Latitude,
longitude: $scope.Item.Longitude
},
zoom: 16,
options: {
streetViewControl: true,
maxZoom: 20,
minZoom: 8,
mapTypeId: google.maps.MapTypeId.HYBRID
},
showTraffic: true,
showBicycling: true,
events: {
blacklist: ['drag', 'dragend', 'dragstart', 'center_changed']
}
};
对于以下可视化效果完美无缺:
但是,我刚刚注意到该区域有可用的 3D 数据,我想将其呈现为这样:
问题
是否可以通过 Angular Google 地图来配置我的初始化,以便按照指示显示地图?
奖金问题
...是否可以通过编程让 'camera' 围绕标记(或中心)旋转?
这是参考图像的地图 link:
https://www.google.com/maps/@40.9570608,-76.8816097,179a,20y,180h,41.69t/data=!3m1!1e3
使用 Google 地图 Javascript API 最好的是 45° imagery。
不像3D map visualization
,45°图像只有:
1) 45° 瓷砖...
2) 4 位天使 (0, 90, 180, 270)
3) 只有卫星模式。 (即使地图是 HYBRID,也不会显示道路名称和其他地图元素)
4)它并非在全球任何地方都可用。 (例如,40.9570608,-76.8816097)
查看此示例了解更多信息。
http://jsfiddle.net/u1qcf892/
前言
我正在使用 Angular Google Maps 来指示校园内不同建筑物的位置。我的初始化过程如下:
$scope.map = {
control: {},
center:
{
latitude: $scope.Item.Latitude,
longitude: $scope.Item.Longitude
},
zoom: 16,
options: {
streetViewControl: true,
maxZoom: 20,
minZoom: 8,
mapTypeId: google.maps.MapTypeId.HYBRID
},
showTraffic: true,
showBicycling: true,
events: {
blacklist: ['drag', 'dragend', 'dragstart', 'center_changed']
}
};
对于以下可视化效果完美无缺:
但是,我刚刚注意到该区域有可用的 3D 数据,我想将其呈现为这样:
问题
是否可以通过 Angular Google 地图来配置我的初始化,以便按照指示显示地图?
奖金问题
...是否可以通过编程让 'camera' 围绕标记(或中心)旋转?
这是参考图像的地图 link: https://www.google.com/maps/@40.9570608,-76.8816097,179a,20y,180h,41.69t/data=!3m1!1e3
使用 Google 地图 Javascript API 最好的是 45° imagery。
不像3D map visualization
,45°图像只有:
1) 45° 瓷砖...
2) 4 位天使 (0, 90, 180, 270)
3) 只有卫星模式。 (即使地图是 HYBRID,也不会显示道路名称和其他地图元素)
4)它并非在全球任何地方都可用。 (例如,40.9570608,-76.8816097)
查看此示例了解更多信息。
http://jsfiddle.net/u1qcf892/