Blender для начинающих/Основы Web технологий

Материал из Викиучебника — открытых книг для открытого мира
Перейти к навигации Перейти к поиску
Blender2017.png



OpenHK2.jpg - перейти к комбинациям клавиш.
Level2.jpg - перейти к первому необязательному для изучения разделу.
NextChapter.jpg - переход к следующей по курсу главе (порядок глав не совпадает с порядком глав по содержанию).

CTRL+ALT+U

CTRL+U

SHIFT+S

CTRL+Q

A

R

G

S

SHIFT+D

ALT+D

CTRL+NUMPAD+

CTRL+NUMPAD-

SHIFT+L

SHIFT+G

ALT+M

F

CTRL+ALT+SHIFT+C

SHIFT+S

D

T

I

Shift+B

B

C

Одни из главных классов Python: bpy.ops | bpy.data | bpy.types.ID

Рендеринг Рендер-ферма
Отсечение Шейдер
Трассировка лучей Сжатие текстур

Расположение элементов интерфейса


Ссылки на материалы
Возможно, Вас заинтересует следующее:
О Blender 2.76 FInfo.jpg Скачать Blender 2.76 FDownload.jpg

Данная глава требует знаний по темам: программирование. Убедительная просьба, изучите основы, иначе часть информации, изложенной здесь, может быть вами не воспринята.

Изучить основы программирования можно здесь: Python и Основы PascalABC.Net.

Blend4Web и Web[править]

«Blend4Web» - аддон, написанный для Blender, и нужный для создания интерактивных Web-страниц с элементами 3D. По данной причине, Вы должны знать основы JS, Ajax и JSON.

JavaScript[править]

JavaScript - скриптовый язык программирования, встраивающийся в web-страницы сайтов, и выполняющийся на стороне клиента (компьютера пользователя), а не сервера.

JSwork1.jpg

Подключение JS[править]

Для использования JS в файле.html надо написать следующее между тегами <body> и </body>:

<script type="text/javascript">
   //код
</script>

Первая стока указывает тип языка, на котором ниже будет писаться код до </script>. Атрибут type принимает значение «text/javascript», указывающее на то, что ниже располагается код, написаный на JS.

Размещать скрипты можно и в <head> </head>:

<script type="text/javascript">
   //код
</script>

Другим способом является использование кода на этом языке из внешнего файла:

<script type="text/javascript" src="путь"></script>

Путь - путь к файлу, в котором лежит ваш скрипт.

Комментарии[править]

Комментарии в JS могут начинаться с //, если они длятся всего одну строку:

// комментарий

Или начинаться с /*, и заканчиваться */, если это многострочные комментарии:

/*
комментарий
*/

Вывод на экран[править]

Вывод чего-либо на страницу производится функцией document.write():

document.write('что-то');

При том, внутри скобок все пишется по правилам HTML (то, что требуется отобразить).

Например, вывод жирного текста:

document.write('<b>пример жирного текста</b>');

Переменные[править]

Все переменные объявляются с ключевого слова var:

var переменная;

Переменная будет локальной, если она объявлена в теле функции. Если же объявлять без var (внутри функции), то созданая переменная будет глобальной. Также, можно сразу указывать ее значение:

var переменная = значение;

К примеру:

var a = 23;

Можно и удалить переменные, написав конструкцию:

delete переменная;

Это действует на переменные, объявленные без var. Если же переменная декларирована с var, то есть два способа ее удалить:

переменная = undefined;
переменная = null;

Переменные let[править]

Эти переменные имеют еще более узкую область видимости - только внутри того блока, в котором объявлены. Например, в следующих блоках:

  1. if
  2. for
  3. while

Их декларация происходит следующим образом:

let переменная = значение;

Массивы[править]

Массивы объявляются с помощью функции Array(), создющую пустой массив:

переменная = new Array()

Для заполнения массива используйте конструкцию:

массив[индекс] = значение

Например:

a = new Array();
a[0] = 12
a[2] = 0

Причем, если Вы указали индекс элемента массива, который превышает все предыдущее, длина массива станет равна i + 1, где i - этот индекс.

Условный оператор if[править]

Условный оператор if в JS имеет синтаксис:

if условие
{
   // команды
}
else
{
   // команды2
}

В условие могут входить такие знаки сравнения:

Оператор сравнения Описание
== равно
=== равно (если и типы переменных равны)
!= не равно
> больше
>= больше или равно
< меньше
<= меньше или равно

Вывод сообщения в зависимости от значений переменных:

var a = 3;
var b = 7;
if (a==b)
{
   document.write('a равно b')
}
else
{
   document.write('a не равно b')
}}

Иная форма оператора if представлена ниже:

if условие
{
   // команды
}
else if условие2
{
   // команды2
}
...
else
{
   // командыN
}

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

Например, здесь выведется только одно сообщение - о равенстве переменных:

var a = 3;
var b = 3;
if (a==b)
{
   document.write('a равно b')
}
else if (a==b)
{
   document.write('a равно b второе сообщение')
}
else
{
   document.write('a не равно b')
}

Сложные условия[править]

Для написания более сложных условий требуются специальные логические операторы: && (и), || (или) и ! (не).

Записать условие «a равно либо b, либо c» с их помощью можно следующим образом:

if ((a==b) || (a==c))

Циклы[править]

Бывают 4 вида циклов:

  1. for
  2. while
  3. do while
  4. for in

Цикл for[править]

Цикл for описывается так:

for (объявление переменной, условие, изменение переменной)
{
   //команды
}

Первым объявляется любая переменная, доступная только для использования ее циклом, либо присваивается значение уже существующей переменной. Ее значение изменения прописывается в самом конце.

Команды в теле цикла выполняются до тех пор, пока условие выполняется, к примеру:

for (v=0, v<100, i+1)
{
   document.write(v+'</br>')
}

Цикл while[править]

Цикл While нужен тогда, когда надо выполнять какие-то действия до тех пор, пока условие верно:

while условие
{
   // команды
}

Например:

while (i<100)
{
   i = i + 1
   document.write(v+'</br>')
}

Цикл do while[править]

От цикла while он имеет одно отличие - блок команд выполняется всегда от одного или более раз. Например:

do
{
   i = i + 1
   document.write(v+'</br>')
}
while (i<100);

Цикл for in[править]

Этот цикл нужен лишь тогда, когда некоторая переменная поочередно должна принять все значения массива. Форма его записи такова:

for (переменная in массив)
{
   // команды
}

Перебирание всех элементов массива:

var a;
var arr = new Array;
arr[0] = 'Учимся ';
arr[1] = 'программировать ';
arr[2] = 'вместе.';
for (a in arr)
{
   document.write(a): // будет выведено 'Учимся программировать вместе.'
}

Команды break и continue[править]

  1. break используется для выхода из цикла.
  2. continue - для новой итерации цикла.

Например выход из цикла при равенстве a = 3:

for (a=-2, a<100, a+1)
{
   if (a = 3)
      {
      document.write('Цикл завершен.');
      break;
      }
   document.write('a== ' + a):
}

Функции[править]

Функции оформляются вот так:

var имя=function(параметры)
{
   //команды
}

Например:

var d;
var f=function(a, b, c)
{
   d = a + b + c;
}

Но функции могут также и возвращать значения с помощью оператора return:

var имя=function(параметры)
{
   //команды
   return значение
}

Например:

var d;
var f=function(a, b, c)
{
   return a + b + c;
}
d = f(1,2,3)

Ajax[править]

Ajax - технология, позволяющая обновить данные страницы, не обновляя страницу полностью. Используется в социальных сетях, таких как: «ВК», «Facebook» и других.

Blend4WebAjax2.jpg

Методы Get и Post[править]

Эти методы используются для передачи данных на сервер. Они различаются при работе тем, что:

  1. Метод get передает все данные серверу в заголовке, что ограничивает возможный размер передаваемой информации.
  2. Метод post передает данные серверу, так что на URL это не влияет.
  3. Как следствие, метод Get не является безопасным для передачи информации.

Этапы работы Ajax[править]

При работе с Ajax придется пройти такие этапы:

  1. Получение данных с формы.
  2. Формировние URL для подключения.
  3. Создание соединения с сервером.
  4. Установка функции, которая выполнится, когда придет ответ с сервера.
  5. Передача данных серверу.

JSON[править]

JSON - простой способ хранить сложные структурированные данные.

Представление данных[править]

Любые данные в JSON представляются двумя способами. Для массивов:

[
   поле:значение
]

И для объектов:

{
   поле:значение
}

Например:

[
   "Имя":"Вася",
   "Фамилия":"Петров",
]

Данную структуру можно включить в объект:

{
   "Дата регистрации":"сегодня",
   "Персона":
      [
      "Имя":"Вася",
      "Фамилия":"Петров",
      ]
}

Конвертирование в строку JSON и наоборот[править]

В JS есть встроенная функция, конвертирующая содержание некоторой переменной в строку JSON - JSON.stringify().

Пусть имеем:

var a = {
   "RegistrationDate":"today",
   "Person":
      [
      "Name":"Den",
      "FriendName":"Kolya",
      ]
}
JSON.stringify(a); // получим: '{"RegistrationDate":"today","Person":["Name":"Den","FriendName":Kolya"]}'

Данный метод просто запишет содержание переменной в одну строку.

Противоположное действие имеет метод JSON.parse():

var a = JSON.parse('{"RegistrationDate":"today","Person":["Name":"Den","FriendName":Kolya"]}')
a.Person[0] // равно "Den"

JSON1.jpg