angular / angular/components

feat(google-maps): Adding a streetview component

Đang mở
#26,255 0 bình luận 6 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

area: google-maps feature P4
Ngôn ngữ chính
TypeScript
Star
25k
Fork
6.8k
Merge trung bình
1 ngày 8 giờ
Pull request đã merge (30 ngày)
91

Mô tả

Feature Description

Thanks for the awesome google-maps package! It abstracts away most of the gmaps logic that we heavily make use of in our apps.

But we're still missing one more functionality, namely an ng-like wrapper around the streetview panorama.

An ideal map-streetview component could go something like this:

<map-streetview [map]="map"
                [overlays]="overlays"
                [...]="otherInputsLikePOVandPositionAndPitch"
                (pano_changed|position_changed|pov_changed...)="myHandler($event)">

The (optional) @Input() map would be the map that allows binding to external panoramas.
The (optional) @Input overlays would support native gmaps overlays but ideally also this package's map-markers.
The @Outputs would be consistent with the standard streetview events.

See section below for more details.

Use Case

In order to mirror map-markers onto the panorama:

image

we have to resort to the native JS API where we take advantage of the fact that google.maps.Marker instances get be bound to a google.maps.StreetViewPanorama via .setMap.

When the map markers are dragged, we can listen to the position changes and update the streetview markers' positions accordingly:

// keep the map marker and its corresponding panorama marker in sync
google.maps.event.addListener(rawMarker, 'position_changed', () => {
    panoramaMarker.setPosition(rawMarker.getPosition().toJSON());
});

But since we're using map-markers (and not the native google.maps.Markers), we have to access the underlying native markers, pass them onto the native streetview and deal with "component" lifecycles manually.

Summing up, it'd be neat to have a map-streetview component.
If it were to support custom overlays such as native markers (or any of the components in this package that implement google.maps.OverlayView), all the better!

Thoughts?

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Hướng nghiên cứu

Bắt đầu với package google-maps và component src/google-maps/map-marker của package đó, sau đó xem xét các API Google Maps StreetViewPanorama và StreetViewEvents được liên kết. Công việc được xem là hoàn tất khi một component map-streetview hỗ trợ các đầu vào và đầu ra được đề xuất, đồng thời việc tích hợp overlay và marker được xác định và bao phủ bằng các bài kiểm thử phù hợp.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
angular, typescript
Lĩnh vực
frontend
Loại issue
Tính năng
Độ khó
5/5
Thời gian dự kiến
Hơn một tuần
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Khá rõ ràng
Mức phù hợp với người mới
35/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.