มีปฏิกิริยาของกูเกิ้ลแผนที่จะขอบเขตของ Polyline

Question 1

ฉันต้องเล่นอยู่กับ Strava ผู้พัฒนารูปแบบ api นิดหน่อยและกำลังสร้างพื้นฐานตอบโต้โปรแกรจะเรียก soem Starva activites และแสดงมันอยู่ในรายชื่อ. สาวนั่นให้พบ ที่นี่.

ฉันมีแผนที่นั่น renders นที่กิจกรรมของเส้นทางในส่วนประกอบ.

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

แฟ้มต้นทาง มาที่นี่.

ที่ภาพหลายเหลี่ยม renders สบายดีแต่ฉันเป็นตอนนี้พยายามคิดให้ออกว่าฉันสามารถขยายแผนที่จะเหมาะกับพว epolyline ในขอบเขต.

ฉันอาจจะเป็น mising soemthing แต่ฉันไม่ต้องรู้หรอกว่าจะหาของ polyline ตัวอย่างให้ได้ขอบเขตหรือแผนที่จะตั้งค่าขอบเขต.

ฉันรู้ว่าเพื่อนชนค poluyline จากเส้นทางแต่ครั้งนึงฉันต้องทำ thay และมีขอบเขตอย่างฉันตั้งผูกใช้ ตอบโต้ของกูเกิ้ลแผนที่ ห้องสมุด?

ขอบคุณ

Question 2

ด้วถ้าขุดคุ้ยลงไปอีกหน่อยและงานวิจัยฉันต้องเจอ workable แก้ปัญหาฉันต้องแบ่งกันเพื่อผลประโยชน์ของคนอื่น:

ฉันเจอสิ่งนี้ไปโพสต์ในวอ 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);

ฉันสามารถผ่านมันไป GoogleMap ส่วนประกอบการใช้ ref อย่าง:

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

และนั่นเรียบร้อยแล้ตั้งค่าแผนที่ผูกตอนที่กิจกรรมเป็นงานหนักมากและไม่เคยหยุด

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

ด้วถ้าขุดคุ้ยลงไปอีกหน่อยและงานวิจัยฉันต้องเจอ workable แก้ปัญหาฉันต้องแบ่งกันเพื่อผลประโยชน์ของคนอื่น:

ฉันเจอสิ่งนี้ไปโพสต์ในวอ 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);

ฉันสามารถผ่านมันไป GoogleMap ส่วนประกอบการใช้ ref อย่าง:

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

และนั่นเรียบร้อยแล้ตั้งค่าแผนที่ผูกตอนที่กิจกรรมเป็นงานหนักมากและไม่เคยหยุด

มีปฏิกิริยาของกูเกิ้ลแผนที่จะขอบเขตของ Polyline

คำถาม

คำตอบที่ดีที่สุด

ในภาษาอื่นๆ

หน้านี้อยู่ในภาษาอื่นๆ

ดังอยู่ในนี้หมวดหมู่

ดังคำถามอยู่ในนี้หมวดหมู่