The application allows to create rectangles, move them, create links between rectangles and delete created links.
npm install
or
make install
npm run webpack-serve
or
make start
Then open http://localhost:8080/
make build
To create a rectangle, double-click on any area of the screen. Rectangles should not intersect. If there is not enough space between rectangles to create a new rectangle, the programm shows an error "Not enough space to create a rectangle! Try again."
To move a rectangle on the screen, left click on it, hold the left mouse button and move the object on the screen.
To link two rectangles, you need to select one of them by left click, it will be highlighted in yellow color. Then select the second rectangle. When the link is successfully created, a line appears between the rectangles. You can create an unlimited amount of links between rectangles. When you move the rectangles on the screen, the links between them are saved.
To remove the link, move the mouse cursor to the line between the rectangles, it will be highlighted in orange. Then left click on it.
To protect your work, you can temporarily disable the creation and deletion of links. To do this, uncheck "Draw link" or "Delete link".
To clear the screen of the created objects, click the Clear button.
Программа позволяет создавать прямоугольники, перемещать их, создавать между ними связи и удалять созданные связи.
Для того, чтобы создать прямоугольник, кликните два раза на любой области экрана. Прямоугольники не должны пересекаться. Если пространства между созданными прямоугольниками недостаточно для создания нового прямоугольника, программа выдаёт ошибку “Not enough space to create a rectangle! Try again.”
Для перемещения прямоугольника по экрану, кликните по нему левой клавишей мыши и, зажав ее, перемещайте объект по экрану.
Чтобы связать между собой два прямоугольника, необходимо выделить один из них одинарным щелчком мыши, он подсветится желтым цветом. Затем выделить второй прямоугольник. Когда связь успешно образована, между прямоугольниками появляется линия. Между прямоугольниками можно создать неограниченное число связей. При перемещении прямоугольников по полю, связи между ними сохраняются.
Для того чтобы удалить связь, подведите курсор мыши к линии между прямоугольниками, она подсветится оранжевым цветом. Затем, кликните по ней левой клавишей мыши.
Для того, чтобы защитить выполненную работу, можно временно заблокировать создание и удаление связей. Для этого, снимите галочки около «Draw link» или «Delete link”, соответственно.
Чтобы очистить экран от созданных объектов, нажмите кнопку Clear.