Skip to content

uizyk/canvas-app

Repository files navigation

Shapes App

  • This is a web application that allows users to create and manipulate shapes on a canvas. The application supports four shapes: circle, square, hexagon, and triangle. Users can drag and drop these shapes onto the canvas, resize them, and change their colors.

  • Brave shield may cause bugs

Installation

  • To run the app, clone this repository and run npm install to install the necessary dependencies. Then, run npm run serve to start the app on a local server.

Usage

  • When the app is opened, a side menu will appear with four shapes that can be dragged and dropped onto the canvas. Once a shape is placed on the canvas, it can be selected by clicking on it. When a shape is selected, a color picker will appear in the side menu that allows the user to change the shape's color.

  • To resize a shape, drag one of the resizing handles that appear around the shape when it is selected. To move a shape, click and drag it to the desired location on the canvas.

  • To remove a shape, double-click on it.

  • To download the canvas as an image, click the "Download Canvas" button in the side menu.

Built With

  • Vue.js
  • Vue-Konva