evgenyantipin / react-redux-saga-osrm-leaflet-example

react redux-saga redux-toolkit leaflet osrm-backend-api antd example app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

🍁 react-leaflet-osrm-example

Demo

It is required to design a module for displaying requests for transportation. It is necessary to create an arbitrary set of applications and points of loading / unloading. Implement a screen form in which there will be a table with a list of applications on the left, and a map on the right. When you select a line with an order in the table, the selected line should be highlighted, and the map will display the loading and unloading points of the order in the form of markers and the polyline of the track between these points, obtained from an arbitrary service for building tracks on roads. Points of loading/unloading applications in the table must be editable (in the form of a select from the directory of points). The border between the table and the map must be changeable with the mouse (moves left and right). Table columns must have a minimum width, if there is not enough space to display the table, taking into account the minimum column width, the table must be able to scroll horizontally. To display the map, it is desirable to use the Leaflet package, for components - AntdDesign, for storing the state of components and data - Redux, for reacting to events - Saga. As the basis of the application, it is desirable to use React create app. Don't use classes, only functional components.

About

react redux-saga redux-toolkit leaflet osrm-backend-api antd example app


Languages

Language:JavaScript 82.9%Language:HTML 9.7%Language:CSS 7.4%