Maps

Map class

google.maps.Map class

คลาสนี้ขยายจาก MVCObject

เข้าถึงโดยการโทรหา const {Map} = await google.maps.importLibrary("maps") โปรดดูไลบรารีใน Maps JavaScript API
Map
Map(mapDiv[, opts])
พารามิเตอร์: 
  • mapDiv:  HTMLElement แผนที่จะแสดงผลเพื่อเติมเต็มองค์ประกอบนี้
  • opts:  MapOptions optional ตัวเลือก
สร้างแผนที่ใหม่ภายในคอนเทนเนอร์ HTML ที่ระบุ ซึ่งโดยทั่วไปคือองค์ประกอบ DIV
DEMO_MAP_ID รหัสแผนที่ซึ่งสามารถใช้กับตัวอย่างโค้ดที่ต้องใช้รหัสแผนที่ รหัสแผนที่นี้ไม่ได้มีไว้สำหรับใช้ในแอปพลิเคชันเวอร์ชันที่ใช้งานจริง และใช้กับฟีเจอร์ที่ต้องกำหนดค่าระบบคลาวด์ไม่ได้ (เช่น การจัดรูปแบบระบบคลาวด์)
controls
ประเภท:  Array<MVCArray<HTMLElement>>
การควบคุมเพิ่มเติมที่จะแนบกับแผนที่ หากต้องการเพิ่มการควบคุมลงในแผนที่ ให้เพิ่ม <div> ของตัวควบคุมลงใน MVCArray ที่สอดคล้องกับ ControlPosition ที่ควรแสดงผล
data
ประเภท:  Data
อินสแตนซ์ของ Data ที่เชื่อมโยงกับแผนที่ เพิ่มองค์ประกอบลงในวัตถุ Data นี้เพื่อแสดงบนแผนที่นี้อย่างสะดวก
mapTypes
ประเภท:  MapTypeRegistry
รีจิสทรีของอินสแตนซ์ MapType ตามรหัสสตริง
overlayMapTypes
ประเภท:  MVCArray<MapType optional>
ประเภทแผนที่เพิ่มเติมที่จะวางซ้อน แผนที่วางซ้อนประเภทต่างๆ จะแสดงอยู่ด้านบนของแผนที่ฐานที่แนบอยู่ตามลำดับที่ปรากฏในอาร์เรย์ overlayMapTypes (แผนที่วางซ้อนที่มีค่าดัชนีสูงกว่าจะแสดงอยู่หน้าแผนที่วางซ้อนที่มีค่าดัชนีต่ำกว่า)
fitBounds
fitBounds(bounds[, padding])
พารามิเตอร์: 
  • bounds:  LatLngBounds|LatLngBoundsLiteral ขอบเขตที่จะแสดง
  • padding:  number|Padding optional ระยะห่างจากขอบในหน่วยพิกเซล ขอบเขตจะพอดีกับส่วนของแผนที่ที่เหลืออยู่หลังจากนำการถ่วงมาบรรทัดแรกออก ค่าตัวเลขจะให้ระยะห่างจากขอบเท่ากันทั้ง 4 ด้าน ป้อน 0 ที่นี่เพื่อให้ fitBounds ทำงานแบบ idempotent ในผลลัพธ์ของ getBounds
ผลลัพธ์: ไม่มี
ตั้งค่าวิวพอร์ตให้อยู่ภายในขอบเขตที่ระบุ
หมายเหตุ: เมื่อตั้งค่าแผนที่เป็น display: none ฟังก์ชัน fitBounds จะอ่านขนาดของแผนที่เป็น 0x0 จึงไม่ทําการใดๆ หากต้องการเปลี่ยนวิวพอร์ตขณะที่แผนที่ซ่อนอยู่ ให้ตั้งค่าแผนที่เป็น visibility: hidden เพื่อให้ Div ของแผนที่มีขนาดจริง สำหรับแผนที่เวกเตอร์ วิธีการนี้จะตั้งค่าการเอียงและการมุ่งหน้าของแผนที่เป็นค่าเริ่มต้นเป็น 0 การเรียกใช้เมธอดนี้อาจทำให้เกิดภาพเคลื่อนไหวที่ราบรื่นเมื่อแผนที่เลื่อนและซูมเพื่อให้พอดีกับขอบเขต การใช้เมธอดนี้จะแสดงภาพเคลื่อนไหวหรือไม่นั้นขึ้นอยู่กับการหาค่าประมาณภายใน
getBounds
getBounds()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  LatLngBounds|undefined ขอบเขต lat/lng ของวิวพอร์ตปัจจุบัน
แสดงผลขอบเขตละติจูด/ลองจิจูดของวิวพอร์ตปัจจุบัน หากมองเห็นโลกมากกว่า 1 สำเนา ขอบเขตลองจิจูดจะอยู่ที่ -180 ถึง 180 องศา หากแผนที่ยังไม่ได้รับการเริ่มต้นหรือยังไม่ได้ตั้งค่าการซูมและการจัดกึ่งกลาง ผลลัพธ์จะเป็น undefined สำหรับแผนที่เวกเตอร์ที่มีการเอียงหรือทิศทางที่ไม่ใช่ 0 ขอบเขตละติจูด/ลองจิจูดที่แสดงจะแสดงขอบเขตที่เล็กที่สุดซึ่งรวมภูมิภาคที่มองเห็นได้ของวิวพอร์ตของแผนที่ ดู MapCanvasProjection.getVisibleRegion เพื่อดูภูมิภาคที่มองเห็นได้ของวิวพอร์ตแผนที่
getCenter
getCenter()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  LatLng|undefined
แสดงผลตำแหน่งที่แสดงที่กึ่งกลางของแผนที่ โปรดทราบว่าออบเจ็กต์ LatLng นี้ไม่ได้รวมไว้ ดูข้อมูลเพิ่มเติมได้ที่ LatLng หากไม่ได้ตั้งค่าจุดศูนย์กลางหรือขอบเขต ผลลัพธ์จะเป็น undefined
getClickableIcons
getClickableIcons()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  boolean|undefined
แสดงผลความสามารถในการคลิกของไอคอนแผนที่ ไอคอนแผนที่แสดงจุดที่น่าสนใจหรือที่เรียกว่า POI หากค่าที่แสดงผลคือ true แสดงว่าไอคอนบนแผนที่คลิกได้
BetagetDatasetFeatureLayer
getDatasetFeatureLayer(datasetId)
พารามิเตอร์: 
  • datasetId:  string
ผลลัพธ์:  FeatureLayer
แสดงผล FeatureLayer สำหรับ datasetId ที่ระบุ คุณต้องกำหนดค่ารหัสชุดข้อมูลในคอนโซล Google Cloud หากรหัสชุดข้อมูลไม่ได้เชื่อมโยงกับรูปแบบแผนที่ของแผนที่ หรือหากใช้การจัดสไตล์ตามข้อมูลไม่ได้ (ไม่มีรหัสแผนที่ ไม่มีไทล์เวกเตอร์ ไม่มีเลเยอร์ฟีเจอร์การจัดสไตล์ตามข้อมูล หรือไม่มีชุดข้อมูลที่กําหนดค่าไว้ในรูปแบบแผนที่) ระบบจะบันทึกข้อผิดพลาด และ FeatureLayer.isAvailable ที่แสดงผลจะเป็นเท็จ
getDiv
getDiv()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  HTMLElement mapDiv ของแผนที่
getFeatureLayer
getFeatureLayer(featureType)
พารามิเตอร์: 
ผลลัพธ์:  FeatureLayer
แสดงผล FeatureLayer ของ FeatureType ที่เฉพาะเจาะจง คุณต้องเปิดใช้ FeatureLayer ในคอนโซล Google Cloud หาก FeatureLayer ของ FeatureType ที่ระบุไม่มีอยู่ในแผนที่นี้ หรือหากใช้การจัดสไตล์ตามข้อมูลไม่ได้ (ไม่มีรหัสแผนที่ ไม่มีไทล์เวกเตอร์ และไม่มี FeatureLayer ที่เปิดใช้ในสไตล์แผนที่) ระบบจะบันทึกข้อผิดพลาด และ FeatureLayer.isAvailable ที่ได้จะเป็นเท็จ
getHeading
getHeading()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  number|undefined
แสดงผลทิศทางเข็มทิศของแผนที่ ค่าของทิศทางจะวัดเป็นองศา (ตามเข็มนาฬิกา) จากทิศเหนือ หากยังไม่ได้เริ่มต้นแผนที่ ผลลัพธ์จะเป็น undefined
getHeadingInteractionEnabled
getHeadingInteractionEnabled()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  boolean|null
แสดงผลว่ามีการเปิดใช้การโต้ตอบกับส่วนหัวหรือไม่ ตัวเลือกนี้จะมีผลเฉพาะเมื่อแผนที่เป็นแผนที่เวกเตอร์ หากไม่ได้ตั้งค่าไว้ในโค้ด ระบบจะใช้การกําหนดค่าระบบคลาวด์สําหรับรหัสแผนที่ (หากมี)
getInternalUsageAttributionIds
getInternalUsageAttributionIds()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  Iterable<string>|null
แสดงรายการรหัสการระบุแหล่งที่มาของการใช้งาน ซึ่งช่วยให้ Google ทราบว่าไลบรารีและตัวอย่างใดที่เป็นประโยชน์ต่อนักพัฒนาแอป เช่น การใช้ไลบรารีการคลัสเตอร์เครื่องหมาย
getMapCapabilities
getMapCapabilities()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  MapCapabilities
แจ้งให้ผู้เรียกทราบถึงความสามารถปัจจุบันของแผนที่ตามรหัสแผนที่ที่ระบุ
getMapTypeId
getMapTypeId()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  MapTypeId|string|undefined
getProjection
getProjection()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  Projection|undefined
แสดงผล Projection ปัจจุบัน หากยังไม่ได้เริ่มต้นแผนที่ ผลลัพธ์จะเป็น undefined ฟังเหตุการณ์ projection_changed และตรวจสอบค่าว่าไม่ใช่ undefined
getRenderingType
getRenderingType()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  RenderingType
แสดงผล RenderingType ปัจจุบันของแผนที่
getStreetView
getStreetView()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  StreetViewPanorama ภาพพาโนรามาที่เชื่อมโยงกับแผนที่
แสดงผล StreetViewPanorama เริ่มต้นที่เชื่อมโยงกับแผนที่ ซึ่งอาจเป็นภาพพาโนรามาเริ่มต้นที่ฝังอยู่ในแผนที่ หรือภาพพาโนรามาที่กําหนดโดยใช้ setStreetView() การเปลี่ยนแปลง streetViewControl ของแผนที่จะแสดงในการแสดงภาพพาโนรามาที่เชื่อมโยงดังกล่าว
getTilt
getTilt()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  number|undefined
แสดงผลมุมปัจจุบันของการตกกระทบของแผนที่เป็นองศาจากระนาบวิวพอร์ตไปยังระนาบแผนที่ สำหรับแผนที่แรสเตอร์ ผลลัพธ์จะเป็น 0 สำหรับภาพถ่ายที่ถ่ายจากด้านบนโดยตรง หรือ 45 สำหรับภาพถ่าย 45° เมธอดนี้จะไม่แสดงผลค่าที่ setTilt ตั้งไว้ ดูรายละเอียดได้ที่ setTilt
getTiltInteractionEnabled
getTiltInteractionEnabled()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  boolean|null
แสดงผลว่ามีการเปิดใช้การโต้ตอบด้วยการเอียงหรือไม่ ตัวเลือกนี้จะมีผลเฉพาะเมื่อแผนที่เป็นแผนที่เวกเตอร์ หากไม่ได้ตั้งค่าไว้ในโค้ด ระบบจะใช้การกําหนดค่าระบบคลาวด์สําหรับรหัสแผนที่ (หากมี)
getZoom
getZoom()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  number|undefined
แสดงผลการซูมของแผนที่ หากไม่ได้ตั้งค่าการซูม ผลลัพธ์จะเป็น undefined
moveCamera
moveCamera(cameraOptions)
พารามิเตอร์: 
ผลลัพธ์: ไม่มี
ตั้งค่ากล้องของแผนที่เป็นตัวเลือกกล้องเป้าหมายทันทีโดยไม่มีภาพเคลื่อนไหว
panBy
panBy(x, y)
พารามิเตอร์: 
  • x:  number จำนวนพิกเซลที่จะย้ายแผนที่ในแนว x
  • y:  number จำนวนพิกเซลที่จะเลื่อนแผนที่ในแนวตั้ง
ผลลัพธ์: ไม่มี
เปลี่ยนศูนย์กลางของแผนที่ตามระยะทางที่ระบุเป็นพิกเซล หากระยะทางน้อยกว่าทั้งความกว้างและความสูงของแผนที่ การเปลี่ยนภาพจะเป็นภาพเคลื่อนไหวที่ราบรื่น โปรดทราบว่าระบบพิกัดแผนที่จะเพิ่มขึ้นจากตะวันตกไปตะวันออก (สำหรับค่า x) และจากเหนือไปใต้ (สำหรับค่า y)
panTo
panTo(latLng)
พารามิเตอร์: 
  • latLng:  LatLng|LatLngLiteral ละติจูด/ลองจิจูดของจุดศูนย์กลางแผนที่ใหม่
ผลลัพธ์: ไม่มี
เปลี่ยนศูนย์กลางของแผนที่เป็น LatLng ที่ระบุ หากการเปลี่ยนแปลงน้อยกว่าทั้งความกว้างและความสูงของแผนที่ การเปลี่ยนภาพจะเป็นภาพเคลื่อนไหวที่ราบรื่น
panToBounds
panToBounds(latLngBounds[, padding])
พารามิเตอร์: 
  • latLngBounds:  LatLngBounds|LatLngBoundsLiteral ขอบเขตที่จะเลื่อนแผนที่ไป
  • padding:  number|Padding optional ระยะห่างจากขอบในหน่วยพิกเซล ค่าตัวเลขจะให้ระยะห่างจากขอบเท่ากันทั้ง 4 ด้าน ค่าเริ่มต้นคือ 0
ผลลัพธ์: ไม่มี
เลื่อนแผนที่ตามจำนวนขั้นต่ำที่จำเป็นเพื่อบรรจุ LatLngBounds ที่ระบุ เราไม่รับประกันว่าขอบเขตจะปรากฏที่ใดบนแผนที่ ยกเว้นว่าระบบจะเลื่อนแผนที่เพื่อแสดงขอบเขตภายใน {currentMapSizeInPx} - {padding} ให้ได้มากที่สุด สำหรับทั้งแผนที่แรสเตอร์และเวกเตอร์ ระบบจะไม่เปลี่ยนการซูม การเอียง และทิศทางของแผนที่
setCenter
setCenter(latlng)
พารามิเตอร์: 
ผลลัพธ์: ไม่มี
setClickableIcons
setClickableIcons(value)
พารามิเตอร์: 
  • value:  boolean
ผลลัพธ์: ไม่มี
ควบคุมว่าจะคลิกไอคอนแผนที่ได้หรือไม่ ไอคอนแผนที่แสดงจุดที่น่าสนใจหรือที่เรียกว่า POI หากต้องการปิดใช้ความสามารถในการคลิกของไอคอนแผนที่ ให้ส่งค่า false ไปยังเมธอดนี้
setHeading
setHeading(heading)
พารามิเตอร์: 
  • heading:  number
ผลลัพธ์: ไม่มี
ตั้งค่าทิศทางเข็มทิศของแผนที่ซึ่งวัดเป็นองศาจากทิศหลักคือทิศเหนือ สำหรับแผนที่แรสเตอร์ วิธีนี้จะใช้ได้กับภาพถ่ายทางอากาศเท่านั้น
setHeadingInteractionEnabled
setHeadingInteractionEnabled(headingInteractionEnabled)
พารามิเตอร์: 
  • headingInteractionEnabled:  boolean
ผลลัพธ์: ไม่มี
ตั้งค่าว่าจะเปิดใช้การโต้ตอบกับส่วนหัวหรือไม่ ตัวเลือกนี้จะมีผลเฉพาะเมื่อแผนที่เป็นแผนที่เวกเตอร์ หากไม่ได้ตั้งค่าไว้ในโค้ด ระบบจะใช้การกําหนดค่าระบบคลาวด์สําหรับรหัสแผนที่ (หากมี)
setMapTypeId
setMapTypeId(mapTypeId)
พารามิเตอร์: 
ผลลัพธ์: ไม่มี
setOptions
setOptions(options)
พารามิเตอร์: 
ผลลัพธ์: ไม่มี
setRenderingType
setRenderingType(renderingType)
พารามิเตอร์: 
ผลลัพธ์: ไม่มี
ตั้งค่า RenderingType ปัจจุบันของแผนที่
setStreetView
setStreetView(panorama)
พารามิเตอร์: 
  • panorama:  StreetViewPanorama optional พาโนรามาที่จะเชื่อมโยงกับแผนที่
ผลลัพธ์: ไม่มี
เชื่อมโยง StreetViewPanorama กับแผนที่ ภาพพาโนรามานี้จะลบล้าง StreetViewPanorama เริ่มต้น ซึ่งช่วยให้แผนที่เชื่อมโยงกับภาพพาโนรามาภายนอกแผนที่ได้ การตั้งค่าพาโนรามาเป็น null จะเชื่อมโยงพาโนรามาแบบฝังเริ่มต้นกลับไปกับแผนที่
setTilt
setTilt(tilt)
พารามิเตอร์: 
  • tilt:  number
ผลลัพธ์: ไม่มี
สำหรับแผนที่เวกเตอร์ ให้ตั้งค่ามุมตกกระทบของแผนที่ ค่าที่อนุญาตจะจํากัดตามระดับการซูมของแผนที่

สำหรับแผนที่แรสเตอร์ จะควบคุมลักษณะการเปลี่ยนอัตโนมัติสำหรับมุมตกกระทบของแผนที่ ค่าที่อนุญาตมีเพียง 0 และ 45 setTilt(0) ทำให้แผนที่ใช้มุมมองจากด้านบน 0° เสมอ ไม่ว่าจะซูมระดับใดหรือใช้วิวพอร์ตใดก็ตาม setTilt(45) ทําให้มุมเอียงเปลี่ยนเป็น 45 โดยอัตโนมัติทุกครั้งที่มีภาพระดับ 45° สําหรับระดับการซูมและวิวพอร์ตปัจจุบัน และเปลี่ยนกลับไปเป็น 0 เมื่อไม่มีภาพระดับ 45 (นี่คือลักษณะการทํางานเริ่มต้น) ภาพระดับ 45° มีให้บริการสำหรับแผนที่ประเภท satellite และ hybrid ในบางพื้นที่และที่ระดับการซูมบางระดับเท่านั้น หมายเหตุ: getTilt จะแสดงผลมุมเอียงปัจจุบัน ไม่ใช่ค่าที่ตั้งค่าโดย setTilt เนื่องจาก getTilt และ setTilt หมายถึงสิ่งที่แตกต่างกัน คุณจึงไม่ควรbind()พร็อพเพอร์ตี้ tilt เนื่องจากอาจทำให้เกิดผลลัพธ์ที่ไม่คาดคิด
setTiltInteractionEnabled
setTiltInteractionEnabled(tiltInteractionEnabled)
พารามิเตอร์: 
  • tiltInteractionEnabled:  boolean
ผลลัพธ์: ไม่มี
ตั้งค่าว่าจะเปิดใช้การโต้ตอบด้วยการเอียงหรือไม่ ตัวเลือกนี้จะมีผลเฉพาะเมื่อแผนที่เป็นแผนที่เวกเตอร์ หากไม่ได้ตั้งค่าไว้ในโค้ด ระบบจะใช้การกําหนดค่าระบบคลาวด์สําหรับรหัสแผนที่ (หากมี)
setZoom
setZoom(zoom)
พารามิเตอร์: 
  • zoom:  number ค่าการซูมยิ่งสูง ความละเอียดก็จะยิ่งมากขึ้น
ผลลัพธ์: ไม่มี
กำหนดการซูมของแผนที่
รับค่ามา: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
bounds_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะทริกเกอร์เมื่อขอบเขตของวิวพอร์ตมีการเปลี่ยนแปลง
center_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มต้นเมื่อพร็อพเพอร์ตี้ศูนย์แผนที่เปลี่ยนแปลง
click
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์เมื่อผู้ใช้คลิกแผนที่ ระบบจะแสดง MapMouseEvent ที่มีพร็อพเพอร์ตี้สําหรับตําแหน่งที่คลิก เว้นแต่จะมีการคลิกไอคอนสถานที่ ซึ่งในกรณีนี้ระบบจะแสดง IconMouseEvent ที่มีรหัสสถานที่ IconMouseEvent และ MapMouseEvent เหมือนกัน ยกเว้น IconMouseEvent จะมีฟิลด์รหัสสถานที่ ระบบจะถือว่าเหตุการณ์เป็น MapMouseEvent เสมอเมื่อรหัสสถานที่ไม่สำคัญ เหตุการณ์คลิกจะไม่เริ่มทํางานหากมีการคลิกเครื่องหมายหรือหน้าต่างข้อมูล
contextmenu
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มต้นขึ้นเมื่อมีการเรียกเหตุการณ์ contextmenu ของ DOM ในคอนเทนเนอร์แผนที่
dblclick
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์เมื่อผู้ใช้ดับเบิลคลิกแผนที่ โปรดทราบว่าเหตุการณ์คลิกจะทริกเกอร์ 1 ครั้งหรือ 2 ครั้งก่อนเหตุการณ์นี้ในบางครั้ง
drag
function()
อาร์กิวเมนต์: ไม่มี
ระบบจะเรียกเหตุการณ์นี้ซ้ำๆ ขณะที่ผู้ใช้ลากแผนที่
dragend
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะทริกเกอร์เมื่อผู้ใช้หยุดลากแผนที่ หมายเหตุ: dragend จะไม่ทริกเกอร์เมื่อผู้ใช้หยุดเลื่อนแผนที่โดยใช้แป้นพิมพ์ โปรดใช้เหตุการณ์ Map.idle แทนเพื่อระบุว่าเมื่อใดที่ผู้ใช้หยุดการเลื่อนแผนที่หรือลากแผนที่
dragstart
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มต้นเมื่อผู้ใช้เริ่มลากแผนที่
heading_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะทริกเกอร์เมื่อพร็อพเพอร์ตี้ส่วนหัวของแผนที่มีการเปลี่ยนแปลง
idle
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะทริกเกอร์เมื่อแผนที่ไม่มีการใช้งานหลังจากการเลื่อนหรือซูม
isfractionalzoomenabled_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะทริกเกอร์เมื่อพร็อพเพอร์ตี้ isFractionalZoomEnabled มีการเปลี่ยนแปลง
mapcapabilities_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มต้นเมื่อความสามารถของแผนที่เปลี่ยนแปลง
maptypeid_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มต้นเมื่อพร็อพเพอร์ตี้ mapTypeId มีการเปลี่ยนแปลง
mousemove
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์เมื่อใดก็ตามที่เมาส์ของผู้ใช้เลื่อนไปเหนือคอนเทนเนอร์แผนที่
mouseout
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์เมื่อเมาส์ของผู้ใช้ออกจากคอนเทนเนอร์แผนที่
mouseover
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์เมื่อเมาส์ของผู้ใช้เข้าสู่คอนเทนเนอร์แผนที่
projection_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะทริกเกอร์เมื่อมีการปรับเปลี่ยนการฉายภาพ
renderingtype_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มต้นเมื่อ renderingType มีการเปลี่ยนแปลง
tilesloaded
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มต้นเมื่อโหลดไทล์ที่มองเห็นได้เสร็จแล้ว
tilt_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะทริกเกอร์เมื่อพร็อพเพอร์ตี้การเอียงแผนที่เปลี่ยนแปลง
zoom_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะทริกเกอร์เมื่อพร็อพเพอร์ตี้การซูมแผนที่มีการเปลี่ยนแปลง
rightclick
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์เมื่อผู้ใช้คลิกขวาบนแผนที่

MapOptions interface

google.maps.MapOptions อินเทอร์เฟซ

ออบเจ็กต์ MapOptions ที่ใช้เพื่อกำหนดพร็อพเพอร์ตี้ที่ตั้งค่าในแผนที่ได้
backgroundColor optional
ประเภท:  string optional
สีที่ใช้สำหรับพื้นหลังของ div แผนที่ สีนี้จะปรากฏขึ้นเมื่อการ์ดยังไม่โหลดในขณะที่ผู้ใช้เลื่อน ตัวเลือกนี้จะตั้งค่าได้เมื่อเริ่มต้นแผนที่เท่านั้น
cameraControl optional
ประเภท:  boolean optional
สถานะเปิด/ปิดใช้การควบคุมกล้อง
cameraControlOptions optional
ประเภท:  CameraControlOptions optional
ตัวเลือกการแสดงผลสำหรับการควบคุมกล้อง
center optional
ประเภท:  LatLng|LatLngLiteral optional
ศูนย์กลางแผนที่เริ่มต้น
clickableIcons optional
ประเภท:  boolean optional
ค่าเริ่มต้น: true
เมื่อ false ไอคอนแผนที่จะคลิกไม่ได้ ไอคอนแผนที่แสดงจุดที่น่าสนใจหรือที่เรียกว่า POI
colorScheme optional
ประเภท:  ColorScheme|string optional
ค่าเริ่มต้น: ColorScheme.LIGHT
รูปแบบสีเริ่มต้นของแผนที่ ตัวเลือกนี้จะตั้งค่าได้เมื่อเริ่มต้นแผนที่เท่านั้น
controlSize optional
ประเภท:  number optional
ขนาดของการควบคุมที่ปรากฏบนแผนที่เป็นพิกเซล คุณต้องระบุค่านี้โดยตรงเมื่อสร้างแผนที่ การอัปเดตค่านี้ในภายหลังอาจทําให้ตัวควบคุมอยู่ในสถานะ undefined ควบคุมเฉพาะการควบคุมที่ Maps API สร้างขึ้นเอง ไม่ปรับขนาดการควบคุมที่กำหนดเองซึ่งนักพัฒนาแอปสร้างขึ้น
disableDefaultUI optional
ประเภท:  boolean optional
เปิด/ปิดใช้ปุ่ม UI เริ่มต้นทั้งหมด ลบล้างทีละรายการได้ ไม่ปิดใช้การควบคุมด้วยแป้นพิมพ์ ซึ่งควบคุมโดยตัวเลือก MapOptions.keyboardShortcuts แยกต่างหาก ไม่ปิดใช้การควบคุมด้วยท่าทางสัมผัส ซึ่งควบคุมแยกต่างหากด้วยตัวเลือก MapOptions.gestureHandling
disableDoubleClickZoom optional
ประเภท:  boolean optional
เปิด/ปิดการซูมและการจัดกึ่งกลางเมื่อดับเบิลคลิก เปิดใช้โดยค่าเริ่มต้น

หมายเหตุ: เราไม่แนะนำพร็อพเพอร์ตี้นี้ หากต้องการปิดใช้การซูมเมื่อดับเบิลคลิก ให้ใช้พร็อพเพอร์ตี้ gestureHandling แล้วตั้งค่าเป็น "none"
draggable optional
ประเภท:  boolean optional
หากเป็น false จะป้องกันไม่ให้ลากแผนที่ การลากจะเปิดใช้โดยค่าเริ่มต้น
draggableCursor optional
ประเภท:  string optional
ชื่อหรือ URL ของเมาส์ที่จะแสดงเมื่อวางเมาส์เหนือแผนที่ที่ลากได้ พร็อพเพอร์ตี้นี้ใช้แอตทริบิวต์ css cursor เพื่อเปลี่ยนไอคอน คุณต้องระบุเคอร์เซอร์สำรองอย่างน้อย 1 รายการที่ไม่ใช่ URL เช่นเดียวกับพร็อพเพอร์ตี้ css เช่น draggableCursor: 'url(http://www.example.com/icon.png), auto;'
draggingCursor optional
ประเภท:  string optional
ชื่อหรือ URL ของเมาส์เคอร์เซอร์ที่จะแสดงเมื่อมีการลากแผนที่ พร็อพเพอร์ตี้นี้ใช้แอตทริบิวต์ css cursor เพื่อเปลี่ยนไอคอน คุณต้องระบุเคอร์เซอร์สำรองอย่างน้อย 1 รายการที่ไม่ใช่ URL เช่นเดียวกับพร็อพเพอร์ตี้ css เช่น draggingCursor: 'url(http://www.example.com/icon.png), auto;'
fullscreenControl optional
ประเภท:  boolean optional
สถานะเปิด/ปิดใช้ของการควบคุมแบบเต็มหน้าจอ
fullscreenControlOptions optional
ประเภท:  FullscreenControlOptions optional
ตัวเลือกการแสดงผลสำหรับตัวควบคุมแบบเต็มหน้าจอ
gestureHandling optional
ประเภท:  string optional
การตั้งค่านี้จะควบคุมวิธีที่ API จัดการท่าทางสัมผัสบนแผนที่ ค่าที่ใช้ได้มีดังนี้
  • "cooperative": เหตุการณ์การเลื่อนและท่าทางสัมผัสด้วยนิ้วเดียวจะเลื่อนหน้าเว็บ และไม่ซูมหรือเลื่อนแผนที่ ใช้ 2 นิ้วแตะเพื่อเลื่อนและซูมแผนที่ เลื่อนเหตุการณ์โดยกดแป้น Ctrl หรือ ⌘ เพื่อซูมแผนที่
    ในโหมดนี้ แผนที่จะทำงานร่วมกับหน้าเว็บ
  • "greedy": ท่าทางสัมผัสและการเลื่อนทั้งหมดจะเลื่อนหรือซูมแผนที่
  • "none": ผู้ใช้ไม่สามารถเลื่อนหรือซูมแผนที่ด้วยท่าทางสัมผัส
  • "auto": (ค่าเริ่มต้น) การจัดการท่าทางสัมผัสเป็นแบบร่วมมือหรือแบบละโมบ ทั้งนี้ขึ้นอยู่กับว่าหน้าเว็บเลื่อนได้หรืออยู่ใน iframe
heading optional
ประเภท:  number optional
ทิศทางของภาพถ่ายทางอากาศเป็นองศาที่วัดตามเข็มนาฬิกาจากทิศเหนือ ระบบจะจัดแนวส่วนหัวให้ตรงกับมุมที่ใกล้ที่สุดซึ่งมีภาพ
headingInteractionEnabled optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
แผนที่ควรอนุญาตให้ผู้ใช้ควบคุมทิศทางของกล้อง (การหมุน) หรือไม่ ตัวเลือกนี้จะมีผลเฉพาะเมื่อแผนที่เป็นแผนที่เวกเตอร์ หากไม่ได้ตั้งค่าไว้ในโค้ด ระบบจะใช้การกําหนดค่าระบบคลาวด์สําหรับรหัสแผนที่ (หากมี)
internalUsageAttributionIds optional
ประเภท:  Iterable<string> optional
ค่าเริ่มต้น: null
เพิ่มรหัสการระบุแหล่งที่มาของการใช้งานลงในตัวเริ่มต้น ซึ่งจะช่วยให้ Google ทราบว่าไลบรารีและตัวอย่างใดที่เป็นประโยชน์ต่อนักพัฒนาซอฟต์แวร์ เช่น การใช้ไลบรารีการคลัสเตอร์เครื่องหมาย หากต้องการเลือกไม่ส่งรหัสการระบุแหล่งที่มาของการใช้งาน คุณลบพร็อพเพอร์ตี้นี้หรือแทนที่ค่าด้วยสตริงว่างได้ ระบบจะส่งเฉพาะค่าที่ไม่ซ้ำกัน ระบบอาจไม่สนใจการเปลี่ยนแปลงค่านี้หลังจากการสร้างอินสแตนซ์
isFractionalZoomEnabled optional
ประเภท:  boolean optional
ค่าเริ่มต้น: true สำหรับแผนที่เวกเตอร์และ false สำหรับแผนที่แรสเตอร์
แผนที่ควรอนุญาตให้ซูมเป็นระดับทศนิยมหรือไม่ ฟัง isfractionalzoomenabled_changed เพื่อดูว่าตั้งค่าเริ่มต้นแล้วหรือยัง
keyboardShortcuts optional
ประเภท:  boolean optional
หากเป็น false จะป้องกันไม่ให้แป้นพิมพ์ควบคุมแผนที่ได้ แป้นพิมพ์ลัดจะเปิดใช้โดยค่าเริ่มต้น
mapId optional
ประเภท:  string optional
รหัสแผนที่ของแผนที่ คุณจะตั้งค่าหรือเปลี่ยนแปลงพารามิเตอร์นี้ไม่ได้หลังจากสร้างอินสแตนซ์แผนที่แล้ว Map.DEMO_MAP_ID ใช้เพื่อลองใช้ฟีเจอร์ที่ต้องใช้รหัสแผนที่แต่ไม่จำเป็นต้องเปิดใช้ระบบคลาวด์ได้
mapTypeControl optional
ประเภท:  boolean optional
สถานะเปิด/ปิดใช้เริ่มต้นของตัวควบคุมประเภทแผนที่
mapTypeControlOptions optional
ประเภท:  MapTypeControlOptions optional
ตัวเลือกการแสดงผลเริ่มต้นสำหรับตัวควบคุมประเภทแผนที่
mapTypeId optional
ประเภท:  MapTypeId|string optional
mapTypeId ของแผนที่เริ่มต้น ค่าเริ่มต้นคือ ROADMAP
maxZoom optional
ประเภท:  number optional
ระดับการซูมสูงสุดที่จะแสดงบนแผนที่ หากไม่ระบุหรือตั้งค่าเป็น null ระบบจะใช้การซูมสูงสุดจากแผนที่ประเภทปัจจุบันแทน ค่าการซูมที่ถูกต้องคือตัวเลขตั้งแต่ 0 จนถึงระดับการซูมสูงสุดที่รองรับ
minZoom optional
ประเภท:  number optional
ระดับการซูมขั้นต่ำที่จะแสดงบนแผนที่ หากไม่ระบุหรือตั้งค่าเป็น null ระบบจะใช้การซูมขั้นต่ำจากแผนที่ประเภทปัจจุบันแทน ค่าการซูมที่ถูกต้องคือตัวเลขตั้งแต่ 0 จนถึงระดับการซูมสูงสุดที่รองรับ
noClear optional
ประเภท:  boolean optional
หากเป็น true อย่าล้างเนื้อหาของ div แผนที่
panControl optional
ประเภท:  boolean optional
สถานะเปิด/ปิดใช้ของการควบคุมการเลื่อน

panControlOptions optional
ประเภท:  PanControlOptions optional
ตัวเลือกการแสดงผลสำหรับการควบคุมการแพน

renderingType optional
ประเภท:  RenderingType optional
ค่าเริ่มต้น: RenderingType.RASTER
กำหนดว่าแผนที่ควรเป็นแผนที่แรสเตอร์หรือเวกเตอร์ คุณจะตั้งค่าหรือเปลี่ยนแปลงพารามิเตอร์นี้ไม่ได้หลังจากสร้างอินสแตนซ์แผนที่แล้ว หากไม่ได้ตั้งค่าไว้ การกําหนดค่าระบบคลาวด์สําหรับรหัสแผนที่จะเป็นตัวกําหนดประเภทการแสดงผล (หากมี) โปรดทราบว่าแผนที่เวกเตอร์อาจไม่พร้อมใช้งานในอุปกรณ์และเบราว์เซอร์บางรุ่น และแผนที่จะเปลี่ยนไปใช้แผนที่แรสเตอร์ตามความจำเป็น
restriction optional
ประเภท:  MapRestriction optional
กําหนดขอบเขตที่จํากัดพื้นที่ของแผนที่ที่ผู้ใช้เข้าถึงได้ เมื่อตั้งค่าแล้ว ผู้ใช้จะเลื่อนและซูมได้เฉพาะเมื่อมุมมองกล้องอยู่ภายในขอบเขตเท่านั้น
rotateControl optional
ประเภท:  boolean optional
สถานะเปิด/ปิดใช้ของตัวควบคุมการหมุน
rotateControlOptions optional
ประเภท:  RotateControlOptions optional
ตัวเลือกการแสดงผลสำหรับตัวควบคุมการหมุน
scaleControl optional
ประเภท:  boolean optional
สถานะเปิด/ปิดใช้เริ่มต้นของตัวควบคุมการปรับขนาด
scaleControlOptions optional
ประเภท:  ScaleControlOptions optional
ตัวเลือกการแสดงผลเริ่มต้นสำหรับตัวควบคุมการปรับขนาด
scrollwheel optional
ประเภท:  boolean optional
หากเป็น false ระบบจะปิดใช้การซูมแผนที่โดยใช้ปุ่มลูกกลิ้งของเมาส์ ระบบจะเปิดใช้แป้นลูกล้อโดยค่าเริ่มต้น

หมายเหตุ: เราไม่แนะนำพร็อพเพอร์ตี้นี้ หากต้องการปิดใช้การซูมโดยใช้ปุ่มเลื่อน ให้ใช้พร็อพเพอร์ตี้ gestureHandling แล้วตั้งค่าเป็น "cooperative" หรือ "none"
streetView optional
ประเภท:  StreetViewPanorama optional
StreetViewPanorama เพื่อแสดงเมื่อวางเพ็กแมน Street View บนแผนที่ หากไม่ได้ระบุภาพพาโนรามา StreetViewPanorama เริ่มต้นจะแสดงในdivของแผนที่เมื่อวางหมุด
streetViewControl optional
ประเภท:  boolean optional
สถานะเปิด/ปิดใช้เริ่มต้นของการควบคุมเพ็กแมน Street View ตัวควบคุมนี้เป็นส่วนหนึ่งของ UI เริ่มต้น และควรตั้งค่าเป็น false เมื่อแสดงแผนที่ประเภทที่ไม่ควรแสดงการวางซ้อนถนนของ Street View (เช่น แผนที่ที่ไม่ใช่ประเภท Earth)
streetViewControlOptions optional
ประเภท:  StreetViewControlOptions optional
ตัวเลือกการแสดงผลเริ่มต้นสำหรับการควบคุมเพ็กแมนของ Street View
styles optional
ประเภท:  Array<MapTypeStyle> optional
รูปแบบที่จะใช้กับแผนที่แต่ละประเภทเริ่มต้น โปรดทราบว่าสำหรับโหมด satellite/hybrid และ terrain สไตล์เหล่านี้จะมีผลกับป้ายกำกับและเรขาคณิตเท่านั้น ฟีเจอร์นี้จะใช้ไม่ได้เมื่อใช้รหัสแผนที่หรือเมื่อใช้แผนที่เวกเตอร์ (ให้ใช้การจัดสไตล์แผนที่แบบระบบคลาวด์แทน)
tilt optional
ประเภท:  number optional
สำหรับแผนที่เวกเตอร์ ให้ตั้งค่ามุมตกกระทบของแผนที่ ค่าที่อนุญาตจะจํากัดตามระดับการซูมของแผนที่ สำหรับแผนที่แรสเตอร์ จะควบคุมลักษณะการทำงานแบบสลับอัตโนมัติสำหรับมุมตกกระทบของแผนที่ ค่าที่อนุญาตมีเพียง 0 และ 45 ค่า 0 จะทำให้แผนที่ใช้มุมมองจากด้านบน 0° เสมอ ไม่ว่าจะมีระดับการซูมและวิวพอร์ตใดก็ตาม ค่า 45 ทําให้มุมเอียงเปลี่ยนเป็น 45 โดยอัตโนมัติเมื่อภาพ 45° พร้อมใช้งานสําหรับระดับการซูมและวิวพอร์ตปัจจุบัน และเปลี่ยนกลับไปเป็น 0 เมื่อภาพ 45° ไม่พร้อมใช้งาน (นี่คือลักษณะการทํางานเริ่มต้น) ภาพระดับ 45° มีให้บริการสำหรับแผนที่ประเภท satellite และ hybrid ในบางพื้นที่และที่ระดับการซูมบางระดับเท่านั้น หมายเหตุ: getTilt จะแสดงผลมุมเอียงปัจจุบัน ไม่ใช่ค่าที่ระบุโดยตัวเลือกนี้ เนื่องจาก getTilt และตัวเลือกนี้หมายถึงสิ่งที่แตกต่างกัน คุณจึงไม่ควรbind()พร็อพเพอร์ตี้ tilt เนื่องจากอาจทำให้เกิดผลลัพธ์ที่ไม่คาดคิด
tiltInteractionEnabled optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
แผนที่ควรอนุญาตให้ผู้ใช้ควบคุมการเอียงกล้องหรือไม่ ตัวเลือกนี้จะมีผลเฉพาะเมื่อแผนที่เป็นแผนที่เวกเตอร์ หากไม่ได้ตั้งค่าไว้ในโค้ด ระบบจะใช้การกําหนดค่าระบบคลาวด์สําหรับรหัสแผนที่ (หากมี)
zoom optional
ประเภท:  number optional
ระดับการซูมแผนที่เริ่มต้น ค่าการซูมที่ถูกต้องคือตัวเลขตั้งแต่ 0 จนถึงระดับการซูมสูงสุดที่รองรับ ค่าการซูมยิ่งมาก ความละเอียดก็จะยิ่งสูงขึ้น
zoomControl optional
ประเภท:  boolean optional
สถานะเปิด/ปิดใช้ของตัวควบคุมการซูม
zoomControlOptions optional
ประเภท:  ZoomControlOptions optional
ตัวเลือกการแสดงผลสำหรับตัวควบคุมการซูม

MapElement class

google.maps.MapElement class

MapElement เป็นHTMLElementคลาสย่อยสำหรับการแสดงผลแผนที่ หลังจากโหลดไลบรารี maps แล้ว คุณสามารถสร้างแผนที่ใน HTML ได้ เช่น 

<gmp-map center="37.4220656,-122.0840897" zoom="10" map-id="DEMO_MAP_ID">
  <button slot="control-block-start-inline-end">Custom Control</button>
</gmp-map>
ภายในจะใช้ Map ซึ่งเข้าถึงได้ด้วยพร็อพเพอร์ตี้ innerMap

องค์ประกอบที่กำหนดเอง:
<gmp-map center="lat,lng" heading-interaction-disabled internal-usage-attribution-ids="id1 id2" map-id="string" rendering-type="vector" tilt-interaction-disabled zoom="number"></gmp-map>

คลาสนี้ขยายจาก HTMLElement

คลาสนี้ใช้ MapElementOptions

เข้าถึงโดยการโทรหา const {MapElement} = await google.maps.importLibrary("maps") โปรดดูไลบรารีใน Maps JavaScript API
MapElement
MapElement([options])
พารามิเตอร์: 
center
ประเภท:  LatLng|LatLngLiteral optional
ละติจูด/ลองจิจูดของศูนย์กลางแผนที่
แอตทริบิวต์ HTML:
  • <gmp-map center="lat,lng"></gmp-map>
headingInteractionDisabled
ประเภท:  boolean optional
ค่าเริ่มต้น: false
แผนที่ควรอนุญาตให้ผู้ใช้ควบคุมทิศทางของกล้อง (การหมุน) หรือไม่ ตัวเลือกนี้จะมีผลเฉพาะเมื่อแผนที่เป็นแผนที่เวกเตอร์ หากไม่ได้ตั้งค่าไว้ในโค้ด ระบบจะใช้การกําหนดค่าระบบคลาวด์สําหรับรหัสแผนที่ (หากมี)
แอตทริบิวต์ HTML:
  • <gmp-map heading-interaction-disabled></gmp-map>
innerMap
ประเภท:  Map
การอ้างอิงถึง Map ที่ MapElement ใช้ภายใน
internalUsageAttributionIds
ประเภท:  Iterable<string> optional
ค่าเริ่มต้น: null
เพิ่มรหัสการระบุแหล่งที่มาของการใช้งานลงในตัวเริ่มต้น ซึ่งจะช่วยให้ Google ทราบว่าไลบรารีและตัวอย่างใดที่เป็นประโยชน์ต่อนักพัฒนาซอฟต์แวร์ เช่น การใช้ไลบรารีการคลัสเตอร์เครื่องหมาย หากต้องการเลือกไม่ส่งรหัสการระบุแหล่งที่มาของการใช้งาน คุณลบพร็อพเพอร์ตี้นี้หรือแทนที่ค่าด้วยสตริงว่างได้ ระบบจะส่งเฉพาะค่าที่ไม่ซ้ำกัน ระบบอาจไม่สนใจการเปลี่ยนแปลงค่านี้หลังจากการสร้างอินสแตนซ์
แอตทริบิวต์ HTML:
  • <gmp-map internal-usage-attribution-ids="id1 id2"></gmp-map>
mapId
ประเภท:  string optional
รหัสแผนที่ของแผนที่ คุณจะตั้งค่าหรือเปลี่ยนแปลงพารามิเตอร์นี้ไม่ได้หลังจากสร้างอินสแตนซ์แผนที่แล้ว Map.DEMO_MAP_ID ใช้เพื่อลองใช้ฟีเจอร์ที่ต้องใช้รหัสแผนที่แต่ไม่จำเป็นต้องเปิดใช้ระบบคลาวด์ได้
แอตทริบิวต์ HTML:
  • <gmp-map map-id="string"></gmp-map>
renderingType
ประเภท:  RenderingType optional
ค่าเริ่มต้น: RenderingType.VECTOR
กำหนดว่าแผนที่ควรเป็นแผนที่แรสเตอร์หรือเวกเตอร์ คุณจะตั้งค่าหรือเปลี่ยนแปลงพารามิเตอร์นี้ไม่ได้หลังจากสร้างอินสแตนซ์แผนที่แล้ว หากไม่ได้ตั้งค่าไว้ การกําหนดค่าระบบคลาวด์สําหรับรหัสแผนที่จะเป็นตัวกําหนดประเภทการแสดงผล (หากมี) โปรดทราบว่าแผนที่เวกเตอร์อาจไม่พร้อมใช้งานในอุปกรณ์และเบราว์เซอร์บางรุ่น และแผนที่จะเปลี่ยนไปใช้แผนที่แรสเตอร์ตามความจำเป็น
แอตทริบิวต์ HTML:
  • <gmp-map rendering-type="vector"></gmp-map>
  • <gmp-map rendering-type="raster"></gmp-map>
tiltInteractionDisabled
ประเภท:  boolean optional
ค่าเริ่มต้น: false
แผนที่ควรอนุญาตให้ผู้ใช้ควบคุมการเอียงกล้องหรือไม่ ตัวเลือกนี้จะมีผลเฉพาะเมื่อแผนที่เป็นแผนที่เวกเตอร์ หากไม่ได้ตั้งค่าไว้ในโค้ด ระบบจะใช้การกําหนดค่าระบบคลาวด์สําหรับรหัสแผนที่ (หากมี)
แอตทริบิวต์ HTML:
  • <gmp-map tilt-interaction-disabled></gmp-map>
zoom
ประเภท:  number optional
ระดับการซูมของแผนที่ ค่าการซูมที่ถูกต้องคือตัวเลขตั้งแต่ 0 จนถึงระดับการซูมสูงสุดที่รองรับ ค่าการซูมยิ่งมาก ความละเอียดก็จะยิ่งสูงขึ้น
แอตทริบิวต์ HTML:
  • <gmp-map zoom="number"></gmp-map>
control-block-end-inline-center
วางองค์ประกอบที่มีสล็อตในตำแหน่ง ControlPosition.BLOCK_END_INLINE_CENTER
control-block-end-inline-end
วางองค์ประกอบที่มีสล็อตในตำแหน่ง ControlPosition.BLOCK_END_INLINE_END
control-block-end-inline-start
วางองค์ประกอบที่มีสล็อตในตำแหน่ง ControlPosition.BLOCK_END_INLINE_START
control-block-start-inline-center
วางองค์ประกอบที่มีสล็อตในตำแหน่ง ControlPosition.BLOCK_START_INLINE_CENTER
control-block-start-inline-end
วางองค์ประกอบที่มีสล็อตในตำแหน่ง ControlPosition.BLOCK_START_INLINE_END
control-block-start-inline-start
วางองค์ประกอบที่มีสล็อตในตำแหน่ง ControlPosition.BLOCK_START_INLINE_START
control-inline-end-block-center
วางองค์ประกอบที่มีสล็อตในตำแหน่ง ControlPosition.INLINE_END_BLOCK_CENTER
control-inline-end-block-end
วางองค์ประกอบที่มีสล็อตในตำแหน่ง ControlPosition.INLINE_END_BLOCK_END
control-inline-end-block-start
วางองค์ประกอบที่มีสล็อตในตำแหน่ง ControlPosition.INLINE_END_BLOCK_START
control-inline-start-block-center
วางองค์ประกอบที่มีสล็อตในตำแหน่ง ControlPosition.INLINE_START_BLOCK_CENTER
control-inline-start-block-end
วางองค์ประกอบที่มีสล็อตในตำแหน่ง ControlPosition.INLINE_START_BLOCK_END
control-inline-start-block-start
วางองค์ประกอบที่มีสล็อตในตำแหน่ง ControlPosition.INLINE_START_BLOCK_START
default
คุณสามารถสร้างคอมโพเนนต์ที่นํากลับมาใช้ซ้ำได้รอบๆ เว็บคอมโพเนนต์ JavaScript ของ Maps เช่น AdvancedMarkerElement โดยใช้องค์ประกอบที่กําหนดเอง โดยค่าเริ่มต้น องค์ประกอบที่กำหนดเองที่เพิ่มลงใน MapElement โดยตรงจะได้รับการใส่ลงในตำแหน่งและแสดงผลใน MapPanes.overlayMouseTarget อย่างไรก็ตาม Web Components ของ Maps JavaScript API อาจสลับช่องไปยังช่องภายในของ MapElement ได้
BetaaddEventListener
addEventListener(type, listener[, options])
พารามิเตอร์: 
  • type:  string สตริงที่คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่ซึ่งแสดงถึงประเภทเหตุการณ์ที่จะรับฟัง
  • listener:  EventListener|EventListenerObject ออบเจ็กต์ที่รับการแจ้งเตือน ต้องเป็นฟังก์ชันหรือออบเจ็กต์ที่มีเมธอด handleEvent
  • options:  boolean|AddEventListenerOptions optional ดูตัวเลือก เหตุการณ์ที่กําหนดเองรองรับเฉพาะ capture และ passive
ผลลัพธ์:  void
ตั้งค่าฟังก์ชันที่จะเรียกใช้ทุกครั้งที่มีการส่งเหตุการณ์ที่ระบุไปยังเป้าหมาย ดู addEventListener
BetaremoveEventListener
removeEventListener(type, listener[, options])
พารามิเตอร์: 
  • type:  string สตริงที่ระบุประเภทเหตุการณ์ที่จะนำ Listener เหตุการณ์ออก
  • listener:  EventListener|EventListenerObject Listener เหตุการณ์ของตัวแฮนเดิลเหตุการณ์ที่จะนําออกจากเป้าหมายเหตุการณ์
  • options:  boolean|EventListenerOptions optional ดูตัวเลือก
ผลลัพธ์:  void
นํา Listener เหตุการณ์ที่ลงทะเบียนไว้ก่อนหน้านี้ด้วย addEventListener ออกจากเป้าหมาย ดู removeEventListener
gmp-zoomchange
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์เมื่อพร็อพเพอร์ตี้การซูมแผนที่มีการเปลี่ยนแปลง

MapElementOptions interface

google.maps.MapElementOptions อินเทอร์เฟซ

ออบเจ็กต์ MapElementOptions ที่ใช้เพื่อกำหนดพร็อพเพอร์ตี้ที่ตั้งค่าได้ใน MapElement
center optional
ประเภท:  LatLng|LatLngLiteral optional
ดูMapElement.center
headingInteractionDisabled optional
ประเภท:  boolean optional
ดูMapElement.headingInteractionDisabled
internalUsageAttributionIds optional
ประเภท:  Iterable<string> optional
ดูMapElement.internalUsageAttributionIds
mapId optional
ประเภท:  string optional
ดูMapElement.mapId
renderingType optional
ประเภท:  RenderingType optional
ดูMapElement.renderingType
tiltInteractionDisabled optional
ประเภท:  boolean optional
ดูMapElement.tiltInteractionDisabled
zoom optional
ประเภท:  number optional
ดูMapElement.zoom

ZoomChangeEvent class

google.maps.ZoomChangeEvent class

เหตุการณ์นี้สร้างขึ้นจากการติดตามการเปลี่ยนแปลงการซูม

คลาสนี้ขยายจาก Event

เข้าถึงโดยการโทรหา const {ZoomChangeEvent} = await google.maps.importLibrary("maps") โปรดดูไลบรารีใน Maps JavaScript API

MapTypeStyle อินเทอร์เฟซ

google.maps.MapTypeStyle อินเทอร์เฟซ

MapTypeStyle คือคอลเล็กชันตัวเลือกและเครื่องมือจัดรูปแบบที่กําหนดลักษณะการจัดรูปแบบแผนที่ ตัวเลือกจะระบุองค์ประกอบและ/หรือฟีเจอร์แผนที่ที่ควรได้รับผลกระทบ และเครื่องมือจัดสไตล์จะระบุวิธีแก้ไของค์ประกอบและฟีเจอร์เหล่านั้น ดูรายละเอียดได้ที่ข้อมูลอ้างอิงสไตล์
stylers
ประเภท:  Array<Object>
กฎรูปแบบที่จะใช้กับองค์ประกอบและฟีเจอร์แผนที่ที่เลือก ระบบจะใช้กฎตามลําดับที่คุณระบุในอาร์เรย์นี้ ดูหลักเกณฑ์เกี่ยวกับการใช้งานและค่าที่อนุญาตได้ที่ข้อมูลอ้างอิงสไตล์
elementType optional
ประเภท:  string optional
องค์ประกอบที่ควรใช้สไตล์ องค์ประกอบคือลักษณะที่มองเห็นได้ของสถานที่บนแผนที่ เช่น ป้ายกํากับ ไอคอน เส้นขอบหรือสีที่เติมในรูปทรงเรขาคณิต และอื่นๆ ไม่บังคับ หากไม่ได้ระบุ elementType ระบบจะถือว่าค่านี้คือ 'all' ดูรายละเอียดการใช้งานและค่าที่อนุญาตได้ที่ข้อมูลอ้างอิงสไตล์
featureType optional
ประเภท:  string optional
องค์ประกอบหรือกลุ่มองค์ประกอบที่ควรใช้เครื่องมือจัดรูปแบบ ไม่บังคับ หากไม่ได้ระบุ featureType ระบบจะถือว่าค่านี้คือ 'all' ดูรายละเอียดการใช้งานและค่าที่อนุญาตได้ที่ข้อมูลอ้างอิงสไตล์

MapMouseEvent interface

google.maps.MapMouseEvent อินเทอร์เฟซ

ออบเจ็กต์นี้จะแสดงผลจากเหตุการณ์เมาส์ต่างๆ ในแผนที่และการวางซ้อน และมีช่องทั้งหมดที่แสดงด้านล่าง
domEvent
เหตุการณ์ DOM เดิมที่เกี่ยวข้อง นักพัฒนาแอปไม่ควรอาศัยพร็อพเพอร์ตี้ target, currentTarget, relatedTarget และ path ที่กําหนดไว้และมีความสอดคล้องกัน นอกจากนี้ นักพัฒนาแอปไม่ควรใช้โครงสร้าง DOM ของการใช้งาน Maps API ภายในด้วย domEvent อาจใช้คําศัพท์ที่แตกต่างจาก MapMouseEvent เนื่องจากการแมปเหตุการณ์ภายใน (เช่น MapMouseEvent "คลิก" อาจมี domEvent ประเภท KeyboardEvent)
latLng optional
ประเภท:  LatLng optional
ละติจูด/ลองจิจูดที่อยู่ใต้เคอร์เซอร์เมื่อเกิดเหตุการณ์
stop
stop()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  void
ป้องกันไม่ให้เหตุการณ์นี้แพร่กระจายต่อไป

อินเทอร์เฟซ IconMouseEvent

google.maps.IconMouseEvent อินเทอร์เฟซ

ระบบจะส่งออบเจ็กต์นี้ในเหตุการณ์เมื่อผู้ใช้คลิกไอคอนบนแผนที่ รหัสสถานที่ของสถานที่นี้จะจัดเก็บไว้ในสมาชิก placeId หากไม่ต้องการให้หน้าต่างข้อมูลเริ่มต้นปรากฏขึ้น ให้เรียกใช้เมธอด stop() ในเหตุการณ์นี้เพื่อป้องกันไม่ให้ระบบนำไปใช้ ดูข้อมูลเพิ่มเติมเกี่ยวกับรหัสสถานที่ในคู่มือนักพัฒนาแอป Places API

อินเทอร์เฟซนี้ขยายจาก MapMouseEvent

placeId optional
ประเภท:  string optional
รหัสสถานที่ของสถานที่ที่มีการคลิก รหัสสถานที่นี้ใช้ค้นหาข้อมูลเพิ่มเติมเกี่ยวกับสถานที่ที่มีการคลิกได้

ดูข้อมูลเพิ่มเติมเกี่ยวกับรหัสสถานที่ในคู่มือนักพัฒนาแอป Places API
รับค่ามา: domEvent, latLng
รับค่า: stop

ColorScheme constants

google.maps.ColorScheme constants

ตัวระบุสำหรับรูปแบบสีของแผนที่ ระบุค่าเหล่านี้ตามค่า หรือใช้ชื่อของค่าคงที่ เช่น 'FOLLOW_SYSTEM' หรือ google.maps.ColorScheme.FOLLOW_SYSTEM

เข้าถึงโดยการโทรหา const {ColorScheme} = await google.maps.importLibrary("core") โปรดดูไลบรารีใน Maps JavaScript API
DARK รูปแบบสีเข้มสำหรับแผนที่
FOLLOW_SYSTEM ระบบจะเลือกรูปแบบสีตามค่ากําหนดของระบบ
LIGHT รูปแบบสีอ่อนสำหรับแผนที่ ค่าเริ่มต้นสําหรับ Maps JS รุ่นเดิม

MapTypeId constants

google.maps.MapTypeId constants

ตัวระบุสำหรับ MapType ทั่วไป ระบุค่าเหล่านี้ตามค่า หรือใช้ชื่อของค่าคงที่ เช่น 'satellite' หรือ google.maps.MapTypeId.SATELLITE

เข้าถึงโดยการโทรหา const {MapTypeId} = await google.maps.importLibrary("maps") โปรดดูไลบรารีใน Maps JavaScript API
HYBRID แผนที่ประเภทนี้แสดงเลเยอร์ถนนสายหลักแบบโปร่งใสในภาพถ่ายดาวเทียม
ROADMAP แผนที่ประเภทนี้จะแสดงแผนที่ถนนปกติ
SATELLITE แผนที่ประเภทนี้จะแสดงภาพถ่ายจากดาวเทียม
TERRAIN แผนที่ประเภทนี้แสดงแผนที่ที่มีองค์ประกอบทางกายภาพ เช่น ภูมิประเทศและพืชพันธุ์

MapTypeRegistry class

google.maps.MapTypeRegistry class

รีจิสทรีสำหรับอินสแตนซ์ MapType โดยคีย์ตามรหัส MapType

คลาสนี้ขยายจาก MVCObject

เข้าถึงโดยการโทรหา const {MapTypeRegistry} = await google.maps.importLibrary("maps") โปรดดูไลบรารีใน Maps JavaScript API
MapTypeRegistry
MapTypeRegistry()
พารามิเตอร์: ไม่มี
MapTypeRegistry จะเก็บคอลเล็กชันแผนที่ที่กำหนดเองซึ่งพร้อมให้แผนที่นำไปใช้ เช่น API จะปรึกษารีจิสทรีนี้เมื่อแสดงรายการประเภทแผนที่ที่ใช้ได้ภายในการควบคุม
set
set(id, mapType)
พารามิเตอร์: 
  • id:  string ตัวระบุของ MapType ที่จะเพิ่มลงในรีจิสทรี
  • mapType:  MapType|? ออบเจ็กต์ MapType ที่จะเพิ่มลงในรีจิสทรี
ผลลัพธ์: ไม่มี
ตั้งค่ารีจิสทรีเพื่อเชื่อมโยงตัวระบุสตริงที่ส่งกับ MapType ที่ส่ง
รับค่ามา: addListener, bindTo, get, notify, setValues, unbind, unbindAll

MapRestriction interface

google.maps.MapRestriction อินเทอร์เฟซ

ข้อจำกัดที่ใช้กับแผนที่ได้ วิดเจ็ตแผนที่จะไม่มีขนาดเกินข้อจำกัดเหล่านี้
latLngBounds
ประเภท:  LatLngBounds|LatLngBoundsLiteral
เมื่อตั้งค่าแล้ว ผู้ใช้จะเลื่อนและซูมได้เฉพาะภายในขอบเขตที่ระบุเท่านั้น ขอบเขตสามารถจํากัดทั้งลองจิจูดและละติจูด หรือจํากัดเฉพาะละติจูดก็ได้ สำหรับขอบเขตเฉพาะละติจูด ให้ใช้ลองจิจูดตะวันตกและตะวันออกที่ -180 และ 180 ตามลำดับ เช่น latLngBounds: {north: northLat, south: southLat, west: -180, east: 180}
strictBounds optional
ประเภท:  boolean optional
คุณทำให้ขอบเขตมีข้อจำกัดมากขึ้นได้โดยการตั้งค่า Flag strictBounds เป็น true ซึ่งจะลดระยะการซูมออกของผู้ใช้ เพื่อให้ทุกอย่างที่อยู่นอกขอบเขตที่จำกัดยังคงซ่อนอยู่ ค่าเริ่มต้นคือ false ซึ่งหมายความว่าผู้ใช้จะซูมออกจนกว่าจะเห็นพื้นที่ที่ถูกกําหนดขอบทั้งหมด ซึ่งอาจรวมถึงพื้นที่นอกพื้นที่ที่ถูกกําหนดขอบ

TrafficLayer class

google.maps.TrafficLayer class

เลเยอร์การจราจร

คลาสนี้ขยายจาก MVCObject

เข้าถึงโดยการโทรหา const {TrafficLayer} = await google.maps.importLibrary("maps") โปรดดูไลบรารีใน Maps JavaScript API
TrafficLayer
TrafficLayer([opts])
พารามิเตอร์: 
เลเยอร์แสดงการจราจรบนท้องถนนปัจจุบัน
getMap
getMap()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  Map|null
แสดงแผนที่ที่แสดงเลเยอร์นี้
setMap
setMap(map)
พารามิเตอร์: 
  • map:  Map optional
ผลลัพธ์: ไม่มี
แสดงผลเลเยอร์ในแผนที่ที่ระบุ หากตั้งค่าแผนที่เป็น null ระบบจะนำเลเยอร์ออก
setOptions
setOptions(options)
พารามิเตอร์: 
ผลลัพธ์: ไม่มี
รับค่ามา: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll

TrafficLayerOptions interface

google.maps.TrafficLayerOptions อินเทอร์เฟซ

ออบเจ็กต์ TrafficLayerOptions ที่ใช้เพื่อกําหนดพร็อพเพอร์ตี้ที่ตั้งค่าได้ใน TrafficLayer
autoRefresh optional
ประเภท:  boolean optional
ค่าเริ่มต้น: true
กำหนดว่าชั้นการเข้าชมจะรีเฟรชด้วยข้อมูลที่อัปเดตโดยอัตโนมัติหรือไม่
map optional
ประเภท:  Map optional
แผนที่ที่จะแสดงเลเยอร์การจราจร

TransitLayer class

google.maps.TransitLayer class

เลเยอร์ขนส่งสาธารณะ

คลาสนี้ขยายจาก MVCObject

เข้าถึงโดยการโทรหา const {TransitLayer} = await google.maps.importLibrary("maps") โปรดดูไลบรารีใน Maps JavaScript API
TransitLayer
TransitLayer()
พารามิเตอร์: ไม่มี
เลเยอร์แสดงเส้นทางขนส่งสาธารณะ
getMap
getMap()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  Map|null
แสดงแผนที่ที่แสดงเลเยอร์นี้
setMap
setMap(map)
พารามิเตอร์: 
  • map:  Map optional
ผลลัพธ์:  void
แสดงผลเลเยอร์ในแผนที่ที่ระบุ หากตั้งค่าแผนที่เป็น null ระบบจะนำเลเยอร์ออก
รับค่ามา: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll

BicyclingLayer class

google.maps.BicyclingLayer class

เลเยอร์แสดงเลนจักรยานและทางจักรยาน

คลาสนี้ขยายจาก MVCObject

เข้าถึงโดยการโทรหา const {BicyclingLayer} = await google.maps.importLibrary("maps") โปรดดูไลบรารีใน Maps JavaScript API
BicyclingLayer
BicyclingLayer()
พารามิเตอร์: ไม่มี
เลเยอร์แสดงเลนจักรยานและทางจักรยาน รวมถึงลดระดับถนนขนาดใหญ่
getMap
getMap()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  Map|null
แสดงแผนที่ที่แสดงเลเยอร์นี้
setMap
setMap(map)
พารามิเตอร์: 
  • map:  Map optional
ผลลัพธ์:  void
แสดงผลเลเยอร์ในแผนที่ที่ระบุ หากตั้งค่าแผนที่เป็น null ระบบจะนำเลเยอร์ออก
รับค่ามา: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll

CameraOptions interface

google.maps.CameraOptions อินเทอร์เฟซ

ใช้สำหรับตั้งค่าตัวเลือกกล้องของแผนที่
center optional
ประเภท:  LatLngLiteral|LatLng optional
heading optional
ประเภท:  number optional
tilt optional
ประเภท:  number optional
zoom optional
ประเภท:  number optional

VisibleRegion interface

google.maps.VisibleRegion อินเทอร์เฟซ

มีจุด 4 จุดที่กําหนดรูปหลายเหลี่ยม 4 ด้านซึ่งเป็นภูมิภาคที่มองเห็นได้ของแผนที่ ในแผนที่เวกเตอร์ รูปหลายเหลี่ยมนี้อาจเป็นสี่เหลี่ยมคางหมูแทนสี่เหลี่ยมผืนผ้าได้เมื่อแผนที่เวกเตอร์มีการเอียง
farLeft
ประเภท:  LatLng
farRight
ประเภท:  LatLng
latLngBounds
ประเภท:  LatLngBounds
กรอบล้อมรอบที่เล็กที่สุดซึ่งรวมภูมิภาคที่มองเห็นได้
nearLeft
ประเภท:  LatLng
nearRight
ประเภท:  LatLng

RenderingType constants

google.maps.RenderingType constants

เข้าถึงโดยการโทรหา const {RenderingType} = await google.maps.importLibrary("maps") โปรดดูไลบรารีใน Maps JavaScript API
RASTER บ่งบอกว่าแผนที่เป็นแผนที่แรสเตอร์
UNINITIALIZED บ่งบอกว่ายังไม่ทราบว่าแผนที่เป็นเวกเตอร์หรือแรสเตอร์ เนื่องจากแผนที่ยังไม่ได้เริ่มต้น
VECTOR บ่งบอกว่าแผนที่เป็นแผนที่เวกเตอร์

MapCapabilities อินเทอร์เฟซ

google.maps.MapCapabilities อินเทอร์เฟซ

ออบเจ็กต์ที่มีภาพรวมของความสามารถที่พร้อมใช้งานในขณะนี้สำหรับแผนที่ โปรดทราบว่านี่ไม่ได้หมายความว่ามีการโหลดหรือเริ่มต้นโมดูลที่เกี่ยวข้อง แต่หมายความว่าแผนที่ปัจจุบันมีสิทธิ์ใช้ API เหล่านี้ ดูรายการความสามารถที่เป็นไปได้ในพร็อพเพอร์ตี้
isAdvancedMarkersAvailable optional
ประเภท:  boolean optional
หากเป็น "จริง" แสดงว่าแผนที่นี้ได้รับการกําหนดค่าอย่างถูกต้องเพื่อให้ใช้เครื่องหมายขั้นสูงได้ โปรดทราบว่าคุณยังคงต้องนำเข้าไลบรารี marker เพื่อใช้เครื่องหมายขั้นสูง ดูข้อมูลเพิ่มเติมได้ที่ https://goo.gle/gmp-isAdvancedMarkersAvailable
isDataDrivenStylingAvailable optional
ประเภท:  boolean optional
หากเป็น "จริง" แสดงว่าแผนที่นี้ได้รับการกําหนดค่าอย่างถูกต้องเพื่อให้ใช้การจัดรูปแบบตามข้อมูลที่ได้จาก FeatureLayer อย่างน้อย 1 รายการได้ ดูข้อมูลเพิ่มเติมได้ที่ https://goo.gle/gmp-data-driven-styling และ https://goo.gle/gmp-FeatureLayerIsAvailable
isWebGLOverlayViewAvailable optional
ประเภท:  boolean optional
หากเป็น "จริง" แสดงว่าแผนที่นี้ได้รับการกําหนดค่าอย่างถูกต้องเพื่อให้ใช้ WebGLOverlayView ได้