Question

我在这里经历了一些类似的话题，但没有一个对我有帮助。我正在尝试使用Google Maps API在React Js中的一些协调之间划清界限。请在下面查看我的代码。

<div id="map-container" className="map-container mt-3" style={style}>
      <Map
        google={this.props.google}
        zoom={14}
        style={style}
        initialCenter={{
          lat: 36.164195,
          lng: 5.669404
        }}
      >
        <Polyline
          paths={[
            { lat: "36.160093", lng: "5.668375" },
            { lat: "36.164195", lng: "5.669404" },
            { lat: "36.170509", lng: "5.672011" }
          ]}
          strokeColor="#1E1E1E"
          strokeOpacity={0.8}
          strokeWeight={5}
        />
      </Map>
    </div>

Answer 1

我可以使用此代码绘制一条折线。将属性放在选项中

 <Polyline
      options={{
        path: [
          { lat: 37.772, lng: -122.214 },
          { lat: 21.291, lng: -157.821 },
          { lat: -18.142, lng: 178.431 },
          { lat: -27.467, lng: 153.027 }
        ],
        // path: props.polylinePath,
        geodesic: true,
        strokeColor: '#ff2527',
        strokeOpacity: 0.75,
        strokeWeight: 2,
      }}/>

Answer 2

在Polyline中用paths替换path道具。

完全不显示Google地图反应折线

2 个答案: