React 구글지도를 얻을 범위의 폴리선

Question 1

내가 연주되었으로 주변에 아폴로 개발자의 API 를 조금 구축 기본적인 반응하 soem Starva 활동을 표시한다. 저장소 찾을 수 있습니다 여기에.

제가 지도를 렌더링하는 활동 경로에서 구성 요소입니다.

const StravaMap = withScriptjs(
  withGoogleMap(({ zoom, activity }: StravaMapProps) => {
    const center = {
      lat: activity.start_latitude,
      lng: activity.start_longitude,
    };

    const path = activity.map.summary_polyline
      ? createPath(polyline.decode(activity.map.summary_polyline))
      : [];

    return (
      <GoogleMap
        defaultZoom={zoom}
        defaultCenter={center}
        defaultOptions={mapOptions}
      >
        <Marker position={center} />
        {path.length > 0 && (
          <Polyline options={polyLineOptions} path={path} visible />
        )}
      </GoogleMap>
    );
  }),
);

원본 파일에 여기에.

다각형을 렌더링합 벌금,하지만 나는 지금도하는 방법을 알아낼 수 있을 확대 지도를 맞 th epolyline 로습니다.

수도 앱 soemthing 지 명확한 아이디어를 얻는 방법을 보유선 인스턴스를 얻을 경계 또는지도 설정 범위.

내가 알고있는 방법을 버퍼 poluyline 경로에 따라 그러면 나를 구해주고 경계를 어떻게 설정할 수 있습니다 바인딩을 사용하여 이 에 반응 Google 지도는 라이브러리?

감사합니다,

Question 2

조금 더에 굴착과 연구를 발견했 실행할 수 있는 방법을 지속적으로 연구하고 공유할 것 다른 사람의 이익을 위해:

이 게시물에 GitHub

를 사용하여 내가 만들어 도우미 기능을 만들기 google.maps.LatLngBounds

export const createBounds = (path: IPoint[]): google.maps.LatLngBounds => {
  const bounds = new window.google.maps.LatLngBounds();
  path.map((p: IPoint) => bounds.extend(p));
  return bounds;
};

내 StravaMap 나는 그 구성 요소를 전달 경로가 이 기능을 얻는 범위 다음과 같다:

const bounds = createBounds(path);

그런 다음 전달 하는 질문이 나에게 이메일을 구성 요소를 사용하 ref 다음과 같:

  ref={(map) => map && map.fitBounds(bounds)}

는 성공적으로 설정하지도 바인딩 활동이 로드됩니다.

loan.burger · Answer 1 · 2021-11-24T05:33:14

조금 더에 굴착과 연구를 발견했 실행할 수 있는 방법을 지속적으로 연구하고 공유할 것 다른 사람의 이익을 위해:

이 게시물에 GitHub

를 사용하여 내가 만들어 도우미 기능을 만들기 google.maps.LatLngBounds

export const createBounds = (path: IPoint[]): google.maps.LatLngBounds => {
  const bounds = new window.google.maps.LatLngBounds();
  path.map((p: IPoint) => bounds.extend(p));
  return bounds;
};

내 StravaMap 나는 그 구성 요소를 전달 경로가 이 기능을 얻는 범위 다음과 같다:

const bounds = createBounds(path);

그런 다음 전달 하는 질문이 나에게 이메일을 구성 요소를 사용하 ref 다음과 같:

  ref={(map) => map && map.fitBounds(bounds)}

는 성공적으로 설정하지도 바인딩 활동이 로드됩니다.

React 구글지도를 얻을 범위의 폴리선

질문

최고의 응답

다른 언어로

이 페이지는 다른 언어로되어 있습니다

이 카테고리에서 인기

인기 있는 질문에 이 카테고리