6 / 2 / 1
Регистрация: 18.11.2012
Сообщений: 64

Нужен скрипт построения 3D модели икосаэдра (icosahedron)

12.12.2015, 17:00. Показов 1499. Ответов 1

Студворк — интернет-сервис помощи студентам
Без подключения сторонних библиотек и желательно с 1 источником света

В инете не нашел нормального гайда по построению икосаэдра в js (или в canvas, например).

Нужно построить что - нибудь похожее на это: http://codepen.io/alvarobyrne/pen/HIGoa

Нашел программу (без комментариев), которая просто строит проволочную модель и вращает фигуру

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
function Point3d(a, c, b) {
  this.x = (a === undefined) ? 0 : a;
  this.y = (c === undefined) ? 0 : c;
  this.z = (b === undefined) ? 0 : b;
  this.fl = 1000;
  this.vpX = 0;
  this.vpY = 0;
  this.cX = 0;
  this.cY = 0;
  this.cZ = 0
}
Point3d.prototype = {
  setVanishingPoint: function (b, a) {
    this.vpX = b;
    this.vpY = a
  },
  
  setCenter: function (c, b, a) {
    this.cX = c;
    this.cY = b;
    this.cZ = a;
  },
  
  //Rotate function
  rotateX: function (a) {
    var d = Math.cos(a),
      b = Math.sin(a),
      c = this.y * d - this.z * b,
      e = this.z * d + this.y * b;
    this.y = c;
    this.z = e;
    return this
  },
  rotateY: function (a) {
    var d = Math.cos(a),
      c = Math.sin(a),
      b = this.x * d - this.z * c,
      e = this.z * d + this.x * c;
    this.x = b;
    this.z = e;
    return this
  },
  rotateZ: function (a) {
    var d = Math.cos(a),
      b = Math.sin(a),
      c = this.x * d - this.y * b,
      e = this.y * d + this.x * b;
    this.x = c;
    this.y = e;
    return this
  },
  getScreenX: function () {
    var a = this.fl*1.1 / (this.fl + this.z + this.cZ);
    return this.vpX + (this.cX + this.x) * a
  },
  getScreenY: function () {
    var a = this.fl*1.1 / (this.fl + this.z + this.cZ);
    return this.vpY + (this.cY + this.y) * a
  }
};
var points = new Array();
points.push(new Point3d(0, 0, -100));
var change = Math.sqrt(5) / 2;
for (var i = 0; i < 5; i++) {
  points.push(new Point3d(Math.sin(change) * Math.cos(2 * i * Math.PI / 5) * -100, Math.sin(change) * Math.sin(2 * i * Math.PI / 5) * -100, Math.cos(change) * -100))
}
for (var i = 0; i < 5; i++) {
  points.push(new Point3d(Math.sin(change) * Math.cos(2 * i * Math.PI / 5) * 100, Math.sin(change) * Math.sin(2 * i * Math.PI / 5) * 100, Math.cos(change) * 100))
}
points.push(new Point3d(0, 0, 100));
 
function display(b) {
  context.save();
  context.beginPath();
  context.moveTo(b[0].getScreenX(), b[0].getScreenY());
  for (var a = 0; a < b.length; a++) {
    context.lineTo(b[a].getScreenX(), b[a].getScreenY())
  }
  context.closePath();
  context.clip();
  context.strokeStyle = "RGBA(0,0,0,.5)";
  context.fillStyle = b.color;
  context.fill();
  context.stroke();
  context.restore()
}
var faces = new Array(6);
faces[0] = [points[0], points[1], points[2]];
faces[1] = [points[0], points[2], points[3]];
faces[2] = [points[0], points[3], points[4]];
faces[3] = [points[0], points[4], points[5]];
faces[4] = [points[0], points[5], points[1]];
faces[5] = [points[8], points[5], points[1]];
faces[6] = [points[8], points[9], points[1]];
faces[7] = [points[1], points[9], points[2]];
faces[8] = [points[10], points[9], points[2]];
faces[9] = [points[10], points[3], points[2]];
faces[10] = [points[6], points[4], points[3]];
faces[11] = [points[6], points[10], points[3]];
faces[12] = [points[7], points[6], points[4]];
faces[13] = [points[7], points[4], points[5]];
faces[14] = [points[8], points[7], points[5]];
faces[15] = [points[11], points[6], points[7]];
faces[16] = [points[11], points[7], points[8]];
faces[17] = [points[11], points[8], points[9]];
faces[18] = [points[11], points[9], points[10]];
faces[19] = [points[11], points[10], points[6]];
faces.forEach(function (d, c, b) {
  d.color = "RGBA(" + ((Math.random() * 255) | 0) + "," + ((Math.random() * 255) | 0) + "," + ((Math.random() * 255) | 0) + ",.8)"
});
var can = document.createElement("canvas");
can.width = 900;
can.height = 900;
var context = can.getContext("2d");
document.body.appendChild(can);
var mousex = 1100,
  mousey = 1100;
context.lineWidth = 0;
faces.forEach(display);
context.stroke();
 
function displayer() {
  
  context.clearRect(0, 0, can.width, can.height);
  points.forEach(function (a) {
    a.rotateX((mousey - a.vpY) * 0.0001).rotateY((mousex - a.vpX) * 0.0001);
    a.setVanishingPoint(250, 250);
    a.setCenter(a.x, a.y, 500)
  });
  faces = faces.sort(sortbyaz);
  faces.forEach(display)
  requestAnimationFrame(displayer);
}
requestAnimationFrame(displayer);
document.body.onmousemove = function (a) {
  mousex = a.pageX;
  mousey = a.pageY
};
 
function sortbyaz(d, c) {
  var h = 0,
    g = 0;
  for (var f = 0; f < d.length; f++) {
    h += d[f].z
  }
  for (var e = 0; e < c.length; e++) {
    g += c[e].z
  }
  h /= d.length + 1;
  g /= c.length + 1;
  return g - h
};
Миниатюры
Нужен скрипт построения 3D модели икосаэдра (icosahedron)  
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
12.12.2015, 17:00
Ответы с готовыми решениями:

В продолжение построения финансовой модели БД
Доброго времени суток уважаемые форумчане! В продолжение темы финансовой модели взаиморасчетов и построение ее в БД хотелось бы задать...

Создание цикла, для блочного построения 3D модели
Создал программу которая строит кухню из 5 блоков (и 5 разных процедур на создание разных 3D моделей, каждый блок строится и перемещается...

Определение модели и элементов для её построения из Симулинк
Добрый всем день! Можете помочь. Дано задание: &quot;Откройте новое окно для программы моделирования. Сформируйте модель, позволяющую изучить...

1
Superposition
 Аватар для Padimanskas
950 / 615 / 256
Регистрация: 27.10.2013
Сообщений: 2,083
12.12.2015, 17:38
Шляпа, http://codepen.io/Bolloxim/pen/AaCoI
1
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
12.12.2015, 17:38
Помогаю со студенческими работами здесь

Найти наименьшее количество спичек для построения модели из N кубиков (С++ -> Pascal)
Спичечная модель Профессор Самоделкин решил изготовить объемную модель кубиков из спичек, используя спички для рёбер кубиков. Длина...

Какое наименьшее количество спичек нужно Самоделкину для построения модели из N кубиков?
Спичечная модель Профессор Самоделкин решил изготовить объемную модель кубиков из спичек, используя спички для рёбер кубиков. Длина...

Скрипт для построения графика
Доброго времени суток! Подскажите, пожалуйста, как составить скрипт для построения графика. Имеется массив данных X, состоящий из...

Скрипт для построения графика
Данный код должен генерировать меандр и обрабатывать сигнал по указанным формулам. Но что-то идет не так и вид графика получается не таким,...

Нужен пример построения графа
Помогите,пожалуйста.Нужен пример построения графа на windows forms.Обшарил весь интернет и ничего толкового не нашёл(может плохо...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Опции темы

Новые блоги и статьи
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image
8Observer8 10.02.2026
Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .
Установка Qt-версии Lazarus IDE в Debian Trixie Xfce
volvo 10.02.2026
В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .
SDL3 для Web (WebAssembly): Работа со звуком через SDL3_mixer
8Observer8 08.02.2026
Содержание блога Пошагово создадим проект для загрузки звукового файла и воспроизведения звука с помощью библиотеки SDL3_mixer. Звук будет воспроизводиться по клику мышки по холсту на Desktop и по. . .
SDL3 для Web (WebAssembly): Основы отладки веб-приложений на SDL3 по USB и Wi-Fi, запущенных в браузере мобильных устройств
8Observer8 07.02.2026
Содержание блога Браузер Chrome имеет средства для отладки мобильных веб-приложений по USB. В этой пошаговой инструкции ограничимся работой с консолью. Вывод в консоль - это часть процесса. . .
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве
8Observer8 02.02.2026
Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .
Философия технологии
iceja 01.02.2026
На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .
SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf
8Observer8 01.02.2026
Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .
SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли
8Observer8 30.01.2026
Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru