使用默認地圖類型的Google地圖傾斜視圖

我在尋找Google Maps API以訪問我可以在Google地圖移動應用的導航模式中找到的鳥瞰圖。（在這裏左上角的那個：http://www.igyaan.in/33685/google-maps-for-iphone-released-on-itunes/）使用默認地圖類型的Google地圖傾斜視圖

我發現有「傾斜」選項可以顯示SATELLITE或HYBRID地圖類型中的45度視圖。 https://developers.google.com/maps/documentation/javascript/maptypes?hl=en#45DegreeImagery

但是，有沒有辦法在默認的ROAD地圖類型中做到這一點？像我上面提到的導航類似的東西？只要有默認地圖，希望在世界的任何地方。

或者可以通過任何其他方式使用不只是谷歌地圖API？

感謝

來源

2014-06-17 leccmo

正如你所說的，並在文件中還提到關於tilt：

Controls the automatic switching behavior for the angle of incidence 
of the map. The only allowed values are 0 and 45. The value 0 causes 
the map to always use a 0° overhead view regardless of the zoom level 
and viewport. The value 45 causes the tilt angle to automatically switch 
to 45 whenever 45° imagery is available for the current zoom level and 
viewport, and switch back to 0 whenever 45° imagery is not available 
(this is the default behavior). 45° imagery is only available for SATELLITE 
and HYBRID map types, within some locations, and at some zoom levels. 
Note: getTilt returns the current tilt angle, not the value specified by this 
option. Because getTilt and this option refer to different things, do not bind() 
the tilt property; doing so may yield unpredictable effects.

參考：https://developers.google.com/maps/documentation/javascript/reference?csw=1#MapTypeControlOptions

所以，它不可能與roadmap類型。最接近你可以申請css transforms的股利，看看你是否可以忍受它。

CSS：

#map_canvas { 
    height: 500px; 
    width: 500px; 
    -webkit-transform: perspective(1000px) rotate3d(40, 1, 0, 40deg)!important; 
    -moz-transform: perspective(1000px) rotate3d(40, 1, 0, 40deg)!important; 
    -o-transform: perspective(1000px) rotate3d(40, 1, 0, 40deg)!important; 
    transform: perspective(1000px) rotate3d(40, 1, 0, 40deg)!important; 
} 
.container { 
    width:500px; 
    height:500px; 
}

JS：

var map; 
function initialize() { 
    var mapOptions = { 
     center: new google.maps.LatLng(45.518970, -122.672899), 
     zoom: 18, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     disableDefaultUI: true 
    }; 
    map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions); 
} 
google.maps.event.addDomListener(window, 'load', initialize);

演示：http://jsfiddle.net/lotusgodkk/x8dSP/3536/

這並不是你所需要的，但更接近的解決方案。

來源

2014-06-17 14:04:15

感謝卡姆利什。即使這不是我想嘗試的確切的事情，它仍然非常有幫助。我想有一些方法可以通過CSS或其他方式來實現這一點，正如你所提到的。非常感謝。 – leccmo

很好的回答！一個改進，我改變了CSS使用rotateX。否則頂線不直（使用rotate3d）。

#map_canvas { 
-webkit-transform: perspective(1500px) rotateX(45deg) 
    !important; 
-moz-transform: perspective(1500px) rotateX(45deg) !important; 
-o-transform: perspective(1500px) rotateX(45deg) !important; 
transform: perspective(1500px) rotateX(45deg) !important;

}

來源

2015-03-13 09:26:06

使用默認地圖類型的Google地圖傾斜視圖

回答

相關問題