关于如何在reactjs和react-leaflet中使用传单的折线的指针

Question

我对React和Leaflet非常陌生。我正在尝试使用小叶在React中的地图上的对象中绘制一组纬度和经度。有关如何完成此操作的任何指示都将有所帮助。

我已经阅读了https://react-leaflet.js.org中关于react传单的教程。但是我无法继续。任何帮助是极大的赞赏。提前致谢。

我拥有的对象数据数组的示例：

data=[
  {
    from_lat: "12.92415",
    from_long: "77.67229",
    id: "132512",
    to_lat: "12.92732",
    to_long: "77.63575",
  },
  {
    from_lat: "12.96691",
    from_long: "77.74935",
    id: "132513",
    to_lat: "12.92768",
    to_long: "77.62664",
  }
]

Answer 1

您可以按以下状态存储数据：

SelfAdjointEigenSolver

然后遍历数据并返回一个Polyline实例，如下所示：

state = {
    ...
    data: [
      {
        from_lat: "12.92415",
        from_long: "77.67229",
        id: "132512",
        to_lat: "12.92732",
        to_long: "77.63575",
      },
      {
        from_lat: "12.96691",
        from_long: "77.74935",
        id: "132513",
        to_lat: "12.92768",
        to_long: "77.62664",
      }
    ]
  };

Demo