Question

我在我的反应程序中使用 google-maps-react 。是否有任何方法可以在绘制的标记之间绘制折线任何in-bulid方法在标记之间划线

Answer 1

从react-google-maps导入折线，然后在<GoogleMap></GoogleMap>内部导入：

<Polyline 
  path={pathCoordinates} 
  options={{ 
  strokeColor: '#00ffff',
  strokeOpacity: 1,
  strokeWeight: 2,
  icons: [{ 
    icon: "hello",
    offset: '0',
    repeat: '10px'
  }],
}}
/>

然后将一些位置传递给pathCoordinates，例如

pathCoordinates:[ 
  {lat:50, lng:1},
  {lat:50.1, lng:1.1},
]

Answer 2

是的，你可以做的就是在选项内的路径中添加点。

<Polyline   geodesic={true}
            options={{
                path: props.route,
                strokeColor: '#00ffff',
                strokeOpacity: 1,
                strokeWeight: 6,
                icons: [{
                    offset: '0',
                    repeat: '10px'
                }],
            }}
 />

其中props.route看起来像这样

[   
    {"lat": 3.028846373870724, "lng": 101.62019493865353},
    {"lat": 3.0293392107899226, "lng": 101.62000181960445},
    {"lat": 3.0297677644503347, "lng": 101.61980870055538},
    {"lat": 3.0301963179410842, "lng": 101.61967995452267},
    {"lat": 3.0307105819060256, "lng": 101.6194868354736},
    {"lat": 3.0319319578431805, "lng": 101.61916497039181}
]

在google-maps中使用折线 - 反应？

2 个答案: