Maps JavaScript API में 3D मैप में, cameraPosition विकल्प का इस्तेमाल करके कैमरे के फ़ोकस को मैनेज किया जाता है.
मुख्य व्यवहार:
centerकी मदद से: अक्षांश और देशांतर के निर्देशांक, मैप पर उस सटीक पॉइंट के बारे में बताते हैं जिस पर कैमरा फ़ोकस करता है.cameraPositionके साथ: कैमरा, कंस्ट्रक्शन के दौरान दिए गए कोऑर्डिनेट पर रखा जाता है. इस वजह से, अक्सर किसी खास जगह पर व्यू को सेंटर करना मुश्किल हो जाता है.
यहां दिए गए उदाहरण में, center विकल्प का इस्तेमाल करके मैप को शुरू करने का तरीका बताया गया है. इससे यह पक्का किया जा सकता है कि मैप में कोई खास फ़ोकल पॉइंट शामिल हो. मार्कर, center में दिए गए सेंटर पॉइंट को दिखाता है:
सीएसएस
gmp-map-3d { height: 100%; } html, body { height: 100%; margin: 0; padding: 0; }
एचटीएमएल
<html>
<head>
<title>3D Camera Position</title>
<link rel="stylesheet" type="text/css" href="./style.css" />
</head>
<body>
<gmp-map-3d
center="40.7860524,-73.9634983,0"
range="1500"
tilt="70"
heading="-150"
mode="satellite">
<gmp-marker position="40.7860524,-73.9634983" altitude-mode="clamp-to-ground"></gmp-marker>
</gmp-map-3d>
<script
async
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA6myHzS10YXdcazAFalmXvDkrYCp5cLc8&v=beta&libraries=maps3d"></script>
</body>
</html>सैंपल आज़माएं
फ़ील्ड ऑफ़ व्यू (कैमरे से दिख रहा व्यू) और रेंज
दो अलग-अलग पैरामीटर का इस्तेमाल करके, यह अडजस्ट किया जा सकता है कि व्यूपोर्ट में मैप का कितना हिस्सा दिखे: रेंज और फ़ील्ड ऑफ़ व्यू. इन दोनों से "ज़ूम" लेवल पर असर पड़ता है, लेकिन ये अलग-अलग तरीके से काम करते हैं:
range: इससे कैमरे और सेंटर पॉइंट के बीच की दूरी को कंट्रोल किया जाता है. इसे अडजस्ट करने का मतलब है कि कैमरे को मैप के पास या उससे दूर ले जाना.fov(फ़ील्ड ऑफ़ व्यू): इससे कैमरे के लेंस के ऐंगल को कंट्रोल किया जाता है. ज़्यादा वैल्यू, वाइड-ऐंगल लेंस की तरह काम करती है. इससे ज़्यादा एरिया दिखता है. वहीं, कम वैल्यू, टेलीफ़ोटो लेंस की तरह काम करती है.
यहां दी गई तुलना में, एक ही मैप को fov स्पेक्ट्रम के दोनों छोरों पर दिखाया गया है. बाईं ओर मौजूद मैप में, फ़ील्ड ऑफ़ व्यू (एफ़ओवी) को 5 (नैरो/टेलीफ़ोटो) पर सेट किया गया है. वहीं, दाईं ओर मौजूद मैप में, इसे 80 (वाइड-ऐंगल) पर सेट किया गया है.
