Google แผนที่ตั้งค่าการควบคุม

ก่อนหน้านี้: เหตุการณ์ Google Maps

ถัดไป: Google Map ประเภท

แผนที่ Google - ชุดควบคุมการเริ่มต้นการตั้งค่า:

Google แผนที่ - ชุดควบคุมการเริ่มต้นการตั้งค่า:

เมื่อมีการใช้แผนที่ Google มาตรฐานตั้งค่าเริ่มต้นมีดังนี้

.Zoom- แสดงแถบเลื่อนเพื่อควบคุมระดับซูมแผนที่
.PPan- บนจอแสดงผลแผนที่เป็นแบนควบคุมชามเหมือนคลิกที่มุมทั้งสี่ของกระทะแผนที่
.MapType- ช่วยให้ผู้ใช้เลือกประเภทแผนที่ (แผนงานและ satallite) สวิทช์
.StreetView- ปรากฏเป็นไอคอนเพ็กแมนคุณสามารถลากไปยังจุดบนแผนที่เพื่อเปิดมุมมองถนน

Google แผนที่ - ชุดควบคุมมากขึ้น

นอกเหนือไปจากชุดควบคุมเริ่มต้นดังกล่าวข้างต้นนอกจากนี้ Google ยัง:

แผนที่มาตราส่วน .Scale- การแสดงผล
.Rotate- แสดงเส้นรอบวงขนาดเล็กของไอคอนคุณสามารถหมุนแผนที่
.verview มุมมองแผนทำแผนที่จากมุมมองของแผนที่บริเวณกว้าง

เมื่อคุณสร้างแผนที่คุณสามารถระบุชุดควบคุมจะปรากฏโดยการตั้งค่าตัวเลือกหรือโทร setOptions A () เพื่อเปลี่ยนแผนที่ตั้งค่าตัวเลือก

Google แผนที่ - ปิดชุดควบคุมเริ่มต้น

คุณอาจต้องการที่จะปิดการตั้งค่าเริ่มต้นของการควบคุม

หากต้องการปิดชุดควบคุมเริ่มต้นตั้งค่าคุณสมบัติในแผนที่ disableDefaultUI จริง:

ตัวอย่าง

disableDefaultUI:true

ลอง»

Google แผนที่ - การควบคุมการตั้งค่าทั้งหมดที่จะเปิด

ตัวควบคุมบางตั้งค่าการแสดงเริ่มต้นบนแผนที่ในขณะที่คนอื่นจะไม่เว้นแต่คุณจะตั้งพวกเขา

ตั้งค่าการควบคุมเพื่อให้มองเห็นความจริง - ตั้งค่าการควบคุมเป็น false จะซ่อนมัน

ตัวอย่างต่อไปนี้จะมีการเปิดตัวควบคุมทั้งหมด:

ตัวอย่าง

panControl:true,
zoomControl:true,
mapTypeControl:true,
scaleControl:true,
streetViewControl:true,
overviewMapControl:true,
rotateControl:true

ลอง»

Google แผนที่ - ปรับเปลี่ยนชุดควบคุม

บางคนควบคุมแผนที่กำหนด การควบคุมการเปลี่ยนแปลงการตั้งค่าโดยการพัฒนาฟิลด์ตัวเลือกการควบคุม

F ตัวอย่างเช่นในการแก้ไขตัวเลือกการควบคุมซูมระบุ zoomControlOptions zoomControlOptions มีสามตัวเลือกต่อไปนี้:

.google.maps.ZoomControlStyle.SMALL- แสดงผลลดการควบคุมการซูม
.google.maps.ZoomControlStyle.LARGE- ซูมมาตรฐานการควบคุมการแสดงภาพสไลด์
.google.maps.ZoomControlStyle.DEFAULT- อุปกรณ์ที่ใช้และขนาดของแผนที่เลือกการควบคุมที่เหมาะสมที่สุด

ตัวอย่าง

zoomControl : true ,
zoomControlOptions : {
style : google . maps . ZoomControlStyle . SMALL
}

ลอง»

หมายเหตุ: หากคุณจำเป็นต้องปรับเปลี่ยนการควบคุมการควบคุมการเปิดครั้งแรก (ตั้งค่าเป็นจริง)

การควบคุมก็คือการควบคุม MapType

ควบคุม MapType อาจปรากฏในหนึ่งในตัวเลือกรูปแบบต่อไปนี้:

google.maps.MapTypeControlStyle.HORIZONTAL_BAR ในแถบแนวนอนจะปรากฏเป็นชุดของปุ่มควบคุมดังแสดงใน Google แผนที่
google.maps.MapTypeControlStyle.DROPDOWN_MENU, สำหรับการแสดงการควบคุมปุ่มเดียวช่วยให้คุณสามารถเลือกประเภทแผนที่จากเมนูแบบเลื่อนลง
google.maps.MapTypeControlStyle.DEFAULT สำหรับการแสดง "เริ่มต้น" พฤติกรรมซึ่งขึ้นอยู่กับขนาดหน้าจอและอาจมีการเปลี่ยนแปลงในรุ่นอนาคตของเอพีไอ

ตัวอย่าง

mapTypeControl:true,
mapTypeControlOptions: {
style:google.maps.MapTypeControlStyle.DROPDOWN_MENU
}

ลอง»

ในทำนองเดียวกันคุณสามารถใช้การควบคุมคุณสมบัติ ControlPosition สถานที่ที่ระบุ:

ตัวอย่าง

mapTypeControl:true,
mapTypeControlOptions: {
style:google.maps.MapTypeControlStyle.DROPDOWN_MENU,
position:google.maps.ControlPosition.TOP_CENTER
}

ลอง»

Google แผนที่ - การควบคุมที่กำหนดเองตั้ง

สร้างตัวควบคุมที่กำหนดเองเพื่อกลับไปยังกรุงลอนดอนเพื่อคลิกเหตุการณ์: (ถ้าแผนที่ถูกลาก):

ตัวอย่าง

controlDiv.style.padding = '5px';
var controlUI = document.createElement('div');
controlUI.style.backgroundColor = 'yellow';
controlUI.style.border='1px solid';
controlUI.style.cursor = 'pointer';
controlUI.style.textAlign = 'center';
controlUI.title = 'Set map to London';
controlDiv.appendChild(controlUI);
var controlText = document.createElement('div');
controlText.style.fontFamily='Arial,sans-serif';
controlText.style.fontSize='12px';
controlText.style.paddingLeft = '4px';
controlText.style.paddingRight = '4px';
controlText.innerHTML = '<b>Home<b>'
controlUI.appendChild(controlText);

ลอง»