Домашна работа по Компютърна графика. Чертане на линии или окръжности по метода на Брезенхам, от двата края към средата, чертане на кръг по метода на закръглянето и запълване на граници, чрез стек.
Създал съм библиотека на Javascript, която работи в Canvas от HTML и позволява чертането на фигурите лесно и удобно.
Свързал съм я със самия Canvas и позволявам чертане, чрез мишката. Както и съм добавил опции начина на чертане и самото платно. Библиотеката позволява и работа с растеризация, което се иска, за да се види точният метод на чертане и разликата между методите.
Начин на използване:
<script src="graphics.js"></script>
<canvas id="myCanvas" width="700" height="700" style="border:1px solid #c3c3c3;"></canvas>
<script>
//wzimame canvas-a
var canvas = document.getElementById("myCanvas");
//vzimame i context-a na canvasa
var context = canvas.getContext("2d");
//inizializirame bibliotekata
var rasterization = 10;
var pointSize = 3
var boundryColor = #444444;
var graphics = new Graphics(context, canvas, rasterization, pointSize, boundryColor);
//za se nachertae mrejata na tochkite
graphics.drawGrid();
//za da se smeni cveta
graphics.setColor("#ff0000");
graphics.setBoundryColor("#ff0000");
//i drugite funkcii
graphics.drawPoint(x,y); //dobavq pixel na poziciq
graphics.getPoint(x,y); //vzima cveta na poziciqta
graphics.drawBresenhamLineFromSidesToMid(x1, y1, x2, y2);
graphics.drawBresenhamLine(x1, y1, x2, y2);
graphics.drawSimpleCircle(xc, yc, R);
graphics.drawBresenhamCircle(xc, yc, R);
graphics.StackedBoundryFill_4(x, y);
Към повечето публични функции има и дублиращи функции (с наставка UnRasterized), който правят същото, но с допълнителна функция за растеризация. Тя позволява да се предадат директно координатите от Canvas-a и в зависимост от нивото на растеризация да се изчислят правилните обекти. Може да се ползват и без растеризация, като се въведе rasterization = 1;