Уроки, алгоритмы, программы, примеры

Вход на сайт

Материалы по разделам

Построения
на плоскости (2D)
Графика
в пространстве (3D)
Вычислительная
геометрия
Физическое
моделирование
Фрактальная
графика

Новые комментарии

У Вас число превысит максимальное число int. Можно использовать в Вашем случае uint, но лучше все переписать на double.
Добавление к программе строки glutReshapeFunc(changeSize); приводит к тому, что треугольник перестаёт совсем отрисовываться.
Выдаёт ошибку glut32.dll не найден! При том, что он лежит в System32! Всё решил) Нужно отправить не в System32, а в System.
Спасибо за статью. Я не Ваш студент. Но мне она помогла написать функцию для Канторова множества на Python для черепашки: import turtle def kanter(x, y, d):     if d > 1:         turtle...
Как реализовать в данном примере границы расчёта?

Счетчики и рейтинг

Рейтинг@Mail.ru Яндекс.Метрика

JavaScript

Демо JavaScript: 

<canvas id = "canvas" width = "500" height = "500"></canvas><br>
 
<div>
    <select id = "select">
        <option value = "0"> Heart 1 </option>
        <option value = "1"> Heart 2 </option>
        <option value = "2"> Star    </option>
        <option value = "3"> Square  </option>
        <option value = "4"> Arrow   </option>
    </select>
    <button onclick = "init()"> Select </button>
</div>
 
<script>
    /***** Canvas *****/
    let canvas = document.querySelector("canvas");
    let ctx = canvas.getContext("2d");

Статья по теме: 
Демо JavaScript: 

<canvas height="1000" width='1000' id='cnvs'></canvas><br />
<input type="button" onclick="draw()" value="Пуск">
<script>
 
var ctx, imgData, canvas;
var color = {r: 54, g: 163, b: 116 , a: 255}; // цвет папоротника
 
canvas = document.getElementById("cnvs");
ctx = canvas.getContext("2d");
 
function setPixel (x,y,c) // устанавливает пиксель с координатой (x, y) с цветом c
{ 
    var index = 4*(x + canvas.width*y);
    imgData.data[index + 0]=c.r;
    imgData.data[index + 1]=c.g;
    imgData.data[index + 2]=c.b;
    imgData.data[index + 3]=c.a;

Демо JavaScript: 

<html>
	<head>
		<meta charset="UTF-8"/>
		<title>lab 5</title>
		<script src="script2.js"></script>
	</head>
	<body>
		<canvas id="paint" width="500" height="500"></canvas>
		<br/>
		<input type="button" value="Старт" onclick="Start()">
		<input type="button" value="Стоп" onclick="Stop()">	
	</body>
</html>
<style>
body {
    background-color: #FDEAA8;
  }
</style>

var ctx;
var idA;

Демо JavaScript: 

Тест на попадание точки внутрь многоугольника. При нажатии на корпус самолета (серую часть) появляются pepe, летящие вниз.

  let offset = -100;
  let bgColor = '#14142d';
  let bombsFlag = false;
 
  window.addEventListener('load', start);
  document.getElementById('viewport').addEventListener('click', (e) => { // Обработка нажатий на canvas
    let pol = [ // Массив вершин многоугольника, внутрь которого может попасть точка, нужен для передачи в функцию проверки.
      {x: 305 - offset, y: 243},
      {x: 320 - offset, y: 235},

Скриншот к примеру
Среда программирования: 
Visual Studio Code

Построение параметрического графика функций, на примере "Спирали", с возможностью поворота, масштабирования, сдвига графика или плоскости.

Скриншот к примеру
Среда программирования: 
Блокнот

Проверяем принадлежность точки многоугольнику.
В роли точки выступают координаты мыши.
При нажатии ЛКМ по пустому месту на экране (канве) ничего не происходит.
При нажатии ЛКМ по многоугольнику производится обводка контуром данного многоугольник и пауза анимации.
При повторном нажатии на ЛКМ контур исчезает и анимация возобновляется.

Статья по теме: 
Демо JavaScript: 

<canvas id="cvs" width="175" height="175"></canvas>

// инициализация канваса
var canvas = document.getElementById('cvs');
var ctx = canvas.getContext('2d');
 
var x = 0;
var y = 300;
var tick_count = 0;
 
var flag = 0; // 0 - летит вверх
 
var sprite = new Image();
sprite.src = 'http://grafika.me/files/bird_sprite.png'; // наше изображение
 
 
// событие с функцией инициализации
sprite.onload = function() {
	tick();
	requestAnimationFrame(tick);
}
 
// функция для анимации циклических алгоритмов
function tick() {

Статья по теме: 
Демо JavaScript: 

// инициализация канваса
var canvas = document.getElementById("cvs");
var ctx = canvas.getContext("2d");
 
// координаты х, у и радиус
function hexagon(x, y, r) {
  ctx.save();
  ctx.translate(x, y);
  var angle = 0;
  // угол многоугольника — 60 градусов
  // рассчитывается по формуле п/3
  for(var i = 0; i < 6; i ++) {
    ctx.lineTo(Math.cos(angle) * r, Math.sin(angle) * r);
    angle += Math.PI / 3;
  }
  ctx.closePath();
  ctx.restore();
}
// устанавливаем радиус 50
var radius = 50;
// насколько далеко мы хотим разместить каждую строку

Демо JavaScript: 

ParD:
NumberOfIntervals:
Random X

var ctx = document.getElementById("paintbox").getContext('2d');
var x = [];
var y = [];
var x1=[];
var y1=[];
 
function Hermit(t){  //функция для построения многочлена
	var k;
	k=(t-x[0])/(x[1]-x[0]);
	return (1-3*k*k+2*k*k*k)*y[0]+(3*k*k-2*k*k*k)*y[1]+(x[1]-x[0])*((k-2*k*k+k*k*k)*y[2]+(-k*k+k*k*k)*y[3]);
}
 
function compareNumeric(a, b) {  //необходимо для сортировки
  if (a > b) return 1;
  if (a == b) return 0;
  if (a < b) return -1;
}
 
function start()
{

Статья по теме: 
Демо JavaScript: 


Points
Line

<canvas id="canvas" width="1500" height="800"></canvas><br/>
<input type="checkbox" id="Points">Points<br />
<input type="checkbox" id="Line">Line<br />
<input type="button" onclick="update()" value="Update">
<script type="text/javascript">
var coords = [];
var k=0;
var plot = function(x, y, c) { // ”становить пиксель в т. (x, y) с прозрачностью c 
    if(isFinite(x) && isFinite(y)){
        var color = {
            r: plot.color.r,
            g: plot.color.g,
            b: plot.color.b,
            a: plot.color.a*c
        };