0

我想知道如何整合 Leaflet.Polyline.SnakeAnim ( https://github.com/IvanSanchez/Leaflet.Polyline.SnakeAnim ) 和 react-leaflet ( https://github.com/PaulLeCam/react-leaflet ) Leafletjs 插件。

我有一个 React 应用程序，它使用 react-leaflet 在 DOM 中显示一些折线。像这样：

<Polyline weight={4} color={ intToRGB(hashCode(session['session_id'])) } positions={session.waypoints.map(waypoint => [ waypoint.lat, waypoint.lng ])} />

如果我可以为它们设置动画，使它们像前面提到的插件允许的那样“蛇行”，那就太好了。但是由于我的折线是作为 React 组件实现的，所以我看不到如何为它们提供此功能。

我真的很喜欢使用 react-leaflet 语法，如果我不得不将我的应用程序移植到 VanillaJS 来实现这个功能，那将是一个遗憾

任何帮助表示赞赏！

https://github.com/caseysiebel/map-express/blob/master/client/components/Map.js

4

1 回答 1

1

I think it is possible if you make a custom component that calls the snakeIn method. You should be able to create a copy of react-leaflet's Polyline class. In the copy you would import Leaflet.Polyline.SnakeAnim and modify the createLeafletElement function. I think you may have to also override the componentWillMount and componentWillUnmount methods that get inherited from the MapLayer class to use a different signature of adding and removing the polyline to/from the map.

于 2017-04-14T22:42:31.340 回答