Angular-google-maps: FitBounds عندما لا توجد علامة + التكبير الافتراضي؟

تم إنشاؤها على ٢٥ سبتمبر ٢٠١٨  ·  22تعليقات  ·  مصدر: SebastianM/angular-google-maps

أهلا

تعتبر ميزة auto fitBounds الجديدة رائعة ولكن يبدو أنه يمكن إجراء تحسينين:

  • في حالة عدم وجود علامات على الخريطة ، تهبط fitBounds في وسط المحيط الهادئ. ربما لا ينبغي أن تفعل شيئا على الإطلاق؟
  • عند وجود علامة واحدة فقط ، سيكون تكبير FitBounds بحد أقصى ، فهل يمكن تكوين fitBounds.maxZoom الذي من شأنه أن يبدأ فقط لعلامة واحدة؟

التجاوز ممكن لكن قذر نوعا ما

شكرا

important stale

التعليق الأكثر فائدة

يبدو أن هذا يعمل بشكل جيد بالنسبة لي.

<agm-map [latitude]="locations[0].lat()" [longitude]="locations[0].lng()" [fitBounds]="locations.length > 1" [zoom]="14">
    <ng-template ngFor [ngForOf]="locations" let-location>
        <agm-marker [latitude]="location.lat()" [longitude]="location.lng()" [agmFitBounds]="true"></agm-marker>
    </ng-template>
</agm-map>

ال 22 كومينتر

هذا يؤثر علي أيضًا. قمت بتعيين إحداثيات المركز باستخدام latitude و longitude على خريطة agm ولكن عندما يتم تمكين fitBounds ، لا يتم توسيط هذه الإحداثيات (على الرغم من عدم وجود علامة) ، بدلاً من ذلك ، يظهر المحيط كما هو موضح بواسطةjscti.

+1 بناءً على اقتراح من jscti => عندما لا توجد علامات على الخريطة ، تصل fitBounds في وسط المحيط الهادئ. ربما لا ينبغي أن تفعل شيئا على الإطلاق؟

هل لدى أي شخص فكرة عن كيفية تحقيق "لا تفعل شيئًا" إذا لم تكن هناك علامات على الخريطة؟

تهانينا أيضًا (A ++) وشكرًا على المكتبة ، إنها رائعة!

jscti ، هل تمانع في مشاركة كيفية "تجاوز" من فضلك؟

تضمين التغريدة

في حالة عدم وجود علامة ، أقوم بإلغاء تنشيط fitBounds وفرض خطوط الطول / العرض / التكبير:

this.fitBounds = false;
setTimeout(() => {
    this.latitude = this.DEFAULT_LATITUDE;
    this.longitude = this.DEFAULT_LONGITUDE;
    this.zoom = this.DEFAULT_ZOOM_VAL;
});

إذا كانت هناك علامة واحدة ، فأنا أجبر التكبير على قيمة معينة

يبدو أن هذا يعمل بشكل جيد بالنسبة لي.

<agm-map [latitude]="locations[0].lat()" [longitude]="locations[0].lng()" [fitBounds]="locations.length > 1" [zoom]="14">
    <ng-template ngFor [ngForOf]="locations" let-location>
        <agm-marker [latitude]="location.lat()" [longitude]="location.lng()" [agmFitBounds]="true"></agm-marker>
    </ng-template>
</agm-map>

مرحبا

لدي مشكلة مختلفة: يستغرق تطبيقي خط عرض المستخدم ويأخذ وقتًا طويلاً لتوسيط الخريطة في البداية. ثم عندما يبدأ في تجميع الحقول ، يتم تحديد موقع الكثير من العناوين جغرافيًا ثم تحديدها على الخريطة. لكن هذا لا يعمل مع fitbounds للأسباب التالية:
1) إذا لم أقم بتحديد fitbounds ، يتم توسيط الخريطة بشكل صحيح في موقع المستخدم ؛ عندما يقوم المستخدم بتجميع الحقول ، تتم إضافة العلامات ولكن الخريطة لا تتناسب مع الحدود ؛
2) إذا قمت بتعريف fitbounds على أنه صحيح ، فإن الخريطة تتمركز في وسط المحيط الهادئ ؛ عندما يقوم المستخدم بتجميع الحقول ، تتم إضافة العلامات ولكن يتم تصغير الخريطة.

أي مساعدة؟ هذا هو رمز بلدي الفعلي

أتش تي أم أل:

<agm-map #agmMap [style.height.px]="utilsService.calculateMapHeight()" [zoom]="13" [streetViewControl]="false" [fitBounds]="true" [latitude]="genericConstants.lat" [longitude]="genericConstants.lng">
    <agm-marker *ngFor="let l of departuresMarkersList" [latitude]="l.lat" [longitude]="l.lng" [title]="l.name" [label]="l.name" [agmFitBounds]="true"></agm-marker>
    <agm-marker *ngFor="let l of destinationsMarkersList" [latitude]="l.lat" [longitude]="l.lng" [title]="l.name" [label]="l.name" [agmFitBounds]="true"></agm-marker>
    <agm-marker *ngIf="cardMarker !== undefined" [latitude]="cardMarker.lat" [longitude]="cardMarker.lng" [title]="cardMarker.name" [label]="cardMarker.name" [agmFitBounds]="true"></agm-marker>
</agm-map>

ts:

this.utilsService.geoLocalize(fullAddress).then((landmark: Landmark) => {

    const serviceLandmark = new ServiceLandmark(null, type, landmark.lat, landmark.lng, null, null, fullAddress);
    if (type === 'departures') {

          if (this.reopenIndex === -1) {
            this.departuresMarkersList.push(serviceLandmark);
          } else {
            this.departuresMarkersList[this.reopenIndex] = serviceLandmark;
          }

    } else if (type === 'destinations') {

          if (this.reopenIndex === -1) {
            this.destinationsMarkersList.push(serviceLandmark);
          } else {
            this.destinationsMarkersList[this.reopenIndex] = serviceLandmark;
          }

    } else {
          this.cardMarker = serviceLandmark;
    }
}

تم وضع علامة على هذه المشكلة تلقائيًا على أنها قديمة نظرًا لعدم وجود نشاط حديث لها. سيتم إغلاقه إذا لم يحدث أي نشاط آخر. شكرا لمساهماتكم.

الطريقة السهلة لحل المشكلات.

  1. حسنًا ، إذا لم يكن بها أي شيء على الإطلاق ، فأين ستتركز الخريطة؟
  2. ليس من السهل القيام بذلك ، لأننا نحتاج إلى إدارة التبديل من وضع إطار عرض الخريطة حسب المركز ، إلى وضعه حسب الحدود

مرحبًا ، آسف ، أعتقد أن تعليقي الأخير بدا قاسيًا بعض الشيء.

أعتقد أن هناك الآن ثلاث قضايا في هذا الموضوع:

1. fitBounds نشط ، لا توجد علامات

المشكلة: تم تعيين fitBounds على "صواب" ، ولكن لم تتم إضافة علامات. ينتج عن هذا تمركز الخريطة في وسط المحيط.

سأذهب مع اقتراح OP: في حالة عدم وجود علامة (و fitBounds نشطة) ، لا ينبغي توسيط الخريطة (كما في عدم القيام بأي شيء بالإضافة إلى سلوك خرائط Google الافتراضي).

2. fitBounds نشط ، هناك علامة واحدة ، الحد الأقصى للتكبير

المشكلة: مع ضبط fitBounds على "صحيح" وعلامة واحدة فقط ، سيتم تكبير الخريطة إلى الحد الأقصى.

لم تكن هذه مشكلة بالنسبة لي ، لكن يمكنني رؤية حالات الاستخدام التي يكون فيها خيار تعيين أقصى تكبير لـ fitBounds مفيدًا بالفعل.

3. fitBounds نشط ، وأضاف علامات بعد التمركز الأولي ، تصغير الخريطة

المشكلة: عندما تكون fitBounds نشطة بدون علامات أولية ، يتم توسيط الخريطة على المحيط. إذا تمت إضافة علامات بعد ذلك ، فسيتم تصغير الخريطة فقط لإظهار جميع العلامات.

لست متأكدًا تمامًا من أنني حصلت على هذا بشكل صحيح وماذا أفعل حيال ذلك. هل سيكون من الممكن "تنفيذ إجراء fitBounds فقط" بعد التصغير لإظهار جميع العلامات؟ سيؤدي هذا إلى تصغير الخريطة لإظهار جميع العلامات والتكبير مرة أخرى لإظهار العلامات _ فقط_.

أبقه مرتفعا!

حسنًا ، بالنسبة للحالة الأولى ، ماذا تعني عبارة "عدم القيام بأي شيء"؟ ماذا سيعرض؟
بالنسبة للحالة الثانية ، من الواضح كيف يجب أن تبدو ، لكن من الصعب تنفيذها. أيضًا ، ليست حالة استخدام شائعة أن يكون لديك FitBounds بعنصر واحد فقط.

1- يجب ألا تتمركز الخريطة تلقائيًا وأن تبقى فقط عند خط الطول / العرض المحدد

"أيضًا ، ليس من حالات الاستخدام الشائعة أن يكون لديك FitBounds بعنصر واحد فقط."
=> نعم ولكن عندما تأتي العلامات من خادم لا تعرف ما إذا كان سيتعين عليك عرض 0،1، n

تكمن المشكلة في أنك لا تقدم خط عرض / خط طول معينًا عندما يكون هناك fitBounds

أيضًا ، كيف سيتصرف maxZoom عندما تكون هناك عدة نقاط وتكون أقرب إلى بعضها البعض مما يسمح به maxZoom

تكمن المشكلة في أنك لا تقدم خط عرض / خط طول معينًا عندما يكون هناك fitBounds

ولم لا ؟ انها مجرد أن fitBounds تجاهلها. ولكن في حالة عدم وجود علامات ، فربما يجب أن تقوم شركة fitBounds بتعطيل نفسها تلقائيًا واستخدام lon / lat
إنه الحل الذي قمت به يدويًا

أيضًا ، كيف سيتصرف maxZoom عندما تكون هناك عدة نقاط وتكون أقرب إلى بعضها البعض مما يسمح به maxZoom

كنا نتحدث فقط عن "حالة علامة واحدة فقط. أفهم أن كلا الخيارين ليسا مثاليين:

  • خاصية "maxZoom" جديدة يجب استخدامها فقط لعلامة واحدة ، ولكن إذا استخدمها المستخدمون لمزيد من المحددات .. فهذه هي رغبتهم / مشكلتهم وقد تخرج العلامات عن الخريطة
  • سيتم استخدام "maxZoomForSingleMarker" جديد فقط عندما يكون هناك علامة واحدة

الحل الخاص بي لجميع هذه الحالات حيث لا يمكنني استخدام fitbound لجميع هذه الحالات المحددة ويكون الأمر قبيحًا للغاية عندما تنظر إلى الكود ، ولهذا السبب ربما كان يمكن لـ futboud التعامل بشكل جيد مع كل هذه الحالات داخليًا ، ولكن ربما يكون الأمر مجرد بعض الأشياء "اللطيفة" "

مشكلة maxZoom أو maxZoomForSingleMarker ، هي أنه بالنسبة لـ fitBounds نستخدم وظيفة Bounds.extend ، والتي تبني LatLngBounds بناءً على عدد من نقاط LatLng. لا تقبل هذه الميزة مستوى التكبير / التصغير ، وليس من السهل جدًا التبديل من المركز / التكبير / التصغير إلى الحدود والعكس.

بالنسبة إلى توفير خطوط الطول والخطوة المركزية و fitBounds ، فهذا يمثل مشكلة ، لأنه على سبيل المثال سيعيد التوسيط إذا تغير خط الطول المركزي ، حتى إذا كانت fitBounds نشطة. حاليا نحن لا نوصي به.

ما هو السلوك الافتراضي لخرائط Google عند عرضها بدون تمكين fitBounds؟ أعتقد أن هذا هو ما نرغب فيه عندما لا توجد علامات (و fitBounds صحيح). هذا يعني: فقط تجاهل fitBounds إذا لم تكن هناك علامات.

أعتقد أن هذه هي القضية الرئيسية لهذا الموضوع ، ربما يجب فتح قضايا منفصلة لموضوعات أخرى (مثل maxZoom) ، حتى لو كانت مرتبطة. ما رأيك؟

لا يوجد fitBounds في جوجل ، كل شيء AGM.

أوم ... يمكن أن أحاول

تم وضع علامة على هذه المشكلة تلقائيًا على أنها قديمة نظرًا لعدم وجود نشاط حديث لها. سيتم إغلاقه إذا لم يحدث أي نشاط آخر. شكرا لمساهماتكم.

onMapReady (حدث) {
this.mapReady = حدث ؛
}

حدود const: LatLngBounds = new google.maps.LatLngBounds () ؛
لـ (const pol of this.polyLinePoints) {
bounds.extend (new google.maps.LatLng (pol.lat، pol.lng)) ؛
}
this.mapReady.fitBounds (حدود) ،

أردت مشاركة حل بديل للمشكلة 1 (تمركز الخريطة في وسط المحيط الهادئ عندما يكون fitBounds صحيحًا ولا توجد علامات).

إجابة brianpkelley تحل المشكلة بطريقة: الخريطة لن تفعل أي شيء (بدون تحريك ، لا تكبير) عندما تتلقى مجموعة جديدة فارغة من العلامات.

ومع ذلك ، إذا كنت تريد إعادة تعيين الخريطة بالكامل في مثل هذه الحالة ، فيمكنك القيام بذلك على النحو التالي:

<ng-container *ngIf="markers.length > 0; else noMarkersTemplate">
    <agm-map [fitBounds]="true">
        <!-- Your markers here... -->
    </agm-map>
</ng-container>

<ng-template #noMarkersTemplate>
    <agm-map [latitude]="25" [longitude]="-81" [zoom]="4"></agm-map>
</ng-template>

سيؤدي ذلك إلى توسيط الخريطة عند النقطة التي يكون خط العرض = 25 وخط الطول = -81 وضبط التكبير / التصغير على 4.

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات