الرقابة المنصوص خرائط جوجل

السابق: حدث خرائط جوجل

المقبلة: أنواع خريطة جوجل

تم تعيين مجموعة التحكم الافتراضي - خريطة جوجل:

تم تعيين مجموعة التحكم الافتراضي - خرائط جوجل:

عند استخدام خريطة جوجل القياسية، الإعدادات الافتراضية هي كما يلي:

.Zoom- يعرض شريط التمرير للسيطرة على خريطة مستوى التكبير
.PPan- على عرض خريطة غير تسيطر مسطحة وعاء يشبه، انقر على الأركان الأربعة للعموم الخريطة
.MapType- تتيح للمستخدم الاختيار بين أنواع خريطة (خارطة الطريق وsatallite) التبديل
.StreetView- يظهر كرمز على الدليل، يمكنك اسحبه إلى نقطة على الخريطة لفتح ستريت فيو

خرائط جوجل - أكبر مجموعة تحكم

بالإضافة إلى مجموعة عناصر التحكم الافتراضية أعلاه، وجوجل أيضا:

العرض .Scale- مقياس الخريطة
.Rotate- عرض محيط صغير من رمز، يمكنك تدوير الخريطة
.verview Map- عرض خطة من منظور خريطة منطقة واسعة

عند إنشاء الخريطة يمكنك تحديد أي مجموعة من الضوابط يتم عرضها من خلال وضع الخيار أو عن طريق الاتصال setOptions () لتغيير خريطة تحديد الخيارات.

خرائط جوجل - إيقاف مجموعة التحكم الافتراضي

قد تحتاج إلى إيقاف مجموعة افتراضية من الضوابط.

لإيقاف مجموعة التحكم الافتراضي، تعيين الخاصية إلى خريطة disableDefaultUI صحيحا:

أمثلة

disableDefaultUI:true

محاولة »

خرائط جوجل - جميع الضوابط المحددة لفتح

بعض الضوابط المنصوص العرض الافتراضي على الخريطة، في حين والبعض الآخر لا، إلا إذا قمت بتعيين لهم.

وضع وحدة التحكم لجعله مرئيا صحيح - وضع وحدة التحكم إلى false لإخفاء ذلك.

الأمثلة التالية مفتوحة إلى جميع الضوابط:

أمثلة

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

محاولة »

خرائط جوجل - تعديل مجموعة تحكم

بعض الضوابط الخرائط شكلي. تغيير الرقابة المنصوص خلال تطوير الحقل خيارات التحكم.

F على سبيل المثال، لتعديل يحدد خيار التحكم تكبير zoomControlOptions. zoomControlOptions يحتوي على الخيارات الثلاثة التالية:

.google.maps.ZoomControlStyle.SMALL- عرض لحد من السيطرة على تكبير
.google.maps.ZoomControlStyle.LARGE- التكبير القياسية تحكم عرض الشرائح
.google.maps.ZoomControlStyle.DEFAULT- المعدات القائمة وحجم الخريطة، حدد عنصر التحكم أنسب

أمثلة

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

محاولة »

ملاحظة: إذا كنتبحاجة إلى تعديل عنصر تحكم، الأولى تحكم بدوره (تعيينها إلى true).

عنصر تحكم آخر هو السيطرة MapType.

قد تظهر سيطرة MapType في واحدة من خيارات نمط التالية:

google.maps.MapTypeControlStyle.HORIZONTAL_BAR، في شريط أفقي سوف تبدو وكأنها مجموعة من أزرار التحكم كما هو موضح في خرائط Google.
google.maps.MapTypeControlStyle.DROPDOWN_MENU، لعرض عنصر تحكم زر واحدة، مما يسمح لك لتحديد نوع خريطة من القائمة المنسدلة.
google.maps.MapTypeControlStyle.DEFAULT، لعرض السلوك "الافتراضي"، الذي يعتمد على حجم الشاشة ويمكن أن تتغير في الإصدارات المستقبلية من API.

أمثلة

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
}

محاولة »

خرائط جوجل - تحديد تحكم مخصص

إنشاء عنصر تحكم مخصص للعودة إلى لندن لهذا الحدث نقرة: (إذا تم سحب الخريطة):

أمثلة

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);

محاولة »