есть набор объектов-прямоугольников, заданных в виде {center_lat, center_lng, length, width, yaw_angle, color}
. Он сериализован в JSON. Максимальное расстояние между парой объектов - 2 км, максимальная длина/ширина - 100 м. Необходимо сделать одностраничное приложение (только фронт), которое отображает карту и позволяет загрузить JSON с объектами. После загрузки карта должна автоматом отмасштабироваться так, чтобы все объекты поместились, и объекты должны отрисоваться на ней в виде прямоугольников соответствующего цвета. Если какие-либо два (или более) объектов накладываются друг на друга (частично или полностью), обвести их жирной красной рамкой. Инструменты - ReactJS, mapbox/leaflet, TypeScript или ES6+ (первое более предпочтительно)
- 4 rectangles
- 1000 rectangles
- You can generate your own JSON at json-generator.com with this template
The last app version from master is always deployed here.
- Clone the project
- Open project root in terminal
- Install dependencies with yarn:
yarn
- Run the application in the development mode:
yarn start
- Open http://localhost:3000 to view it in the browser
- Or build the project for the production:
yarn build
- Show errors with toasts, instead of alerts
- Implement unit-tests
- Implement e2e tests
- Fix todos in the code
- Check different browsers and devices support(now it was tested only in Chrome/MacOS)
This project was bootstrapped with Create React App.
You can learn more in the Create React App documentation.
To learn React, check out the React documentation.