Skip to content

TheDeiw/Basics-of-Computer-Graphics

Repository files navigation

Basics of Computer Graphics

Overview

[UA] Проект створено як збірку лабораторних робіт для дисципліни "Комп'ютерна графіка". Він допомагає студентам зрозуміти принципи роботи з графічними об’єктами, координатними системами та їхньою візуалізацією через програмування.

[EN] Created as collection a lab assignments for the "Computer Graphics" course, this project assists students in understanding the principles of working with graphical objects, coordinate systems, and their visualization through programming.

image

Decription of each lab

Rectangles Painter

[UA] Інструмент для створення прямокутників на координатній площині, малювання їхніх діагоналей із вибраним кольором і трикутниками випадкових кольорів, а також побудови описаних кіл. Програма підтримує масштабування сітки, оновлення графіку та очищення полотна, зберігаючи всі намальовані фігури. Реалізовано за допомогою HTML, CSS і JavaScript з використанням canvas для графіки.

[EN] A tool for drawing rectangles on a coordinate plane, adding diagonals with a chosen color and random-colored triangles, and constructing circumscribed circles. It supports grid scaling, graph updates, and canvas clearing while preserving all drawn shapes. Built using HTML, CSS, and JavaScript with the canvas element for graphics.

420115483-e270828c-e462-4be2-8346-a153e780b2d9

Bezier Curves

[UA] Інструмент для побудови кривої Безьє матричним способом. Для створення точки - натиснути лівою кнопкою по канвасу, щоб перемістити - затиснути правою кнопкою по точці. Показує всі дані про криву: матриця коефіцієнтів та точки на прямій з кроком, вибраним користувачем. Програма підтримує зміну масштабу прокручуванням колеса миші та очищення поля для побудови нової кривої

[EN] A tool for constructing a Bezier curve using a matrix method. To create a point - left-click on the canvas, to move - right-click on the point. Shows all the curve data: a matrix of coefficients and points on a line with a step selected by the user. The program supports zooming by scrolling the mouse wheel and clearing the field to construct a new curve

image

Fractal Generator

[UA] Інструмент для побудови фракталів. Можна побудувати два: tg(z²)+c та Сніжинка Коха ("стандартна" та "рандомізована"). Програма передбачає універсальні параметри для побудови фракталів. Інтерфейс побудови Сніжинки Коха дозволяє масштабізацію за допомогою колеса миші.

[EN] A tool for constructing fractals. Two can be constructed: tg(z²)+c and Koch Snowflake ("standard" and "randomized"). The program provides universal parameters for constructing fractals. The Koch Snowflake construction interface allows zooming using the mouse wheel.

image

image

Color Converter

[UA] Інструмент для роботи з кольорними моделями. Надає можливість змінити колірну модель завантаженого зображення на HSL або CMYK. Програма передбачає зміну яскравості для кольору Magenta.

[EN] A tool for working with color models. Allows you to change the color model of the loaded image to HSL or CMYK. The program provides brightness changes for the Magenta color.

Screenshot 2025-04-21 224405

Affine transformation

[UA] Інструмент для роботи з анімаціями через афінні перетворення. Програма дозволяє створити квадрат на координатній площині та занімувати його рух поверкотору з кутом повороту. Можлива маштабізація за допомогою колеса миші.

[EN] A tool for working with animations through affine transformations. The program allows you to create a square on the coordinate plane and animate its rotation with a rotation angle. It is possible to scale using the mouse wheel.

Screenshot 2025-04-21 234417

About

Some web apps with canvas. Drawing figures, curves, fractals Task for university discipline "Computer Graphics".

Topics

Resources

License

Stars

Watchers

Forks