переход с обработки на processing.js

У меня возникают проблемы при переносе моего кода обработки в processing.js. Мой код обработки содержит банки, изображения, шрифты в папке данных, я хочу использовать те же файлы pde, которые я создал при обработке при переходе на processing.js. Учебник Processing.js показывает, как включить файлы .pde в веб-страницу, но ничего не говорит о том, где упоминать об изображениях или банках в папке данных на вашей веб-странице. Также не работает @preload для изображения.

привет.html -->

<html>
<title>Hello Web - Processing.js Test</title>  
<script src="processing-1.3.6.js"></script>  
<p>  Processing.js Test</p>  
<canvas data-processing-sources="hello/hello.pde"></canvas>  
</html>

image processing processing.js
person vaishali33    schedule 01.11.2011    source источник

Ответы (3)


arrow_upward
2
arrow_downward

Стратегия быстрой миграции:

  • Переместите все ваши изображения в ту же папку, что и ваш эскиз
  • Ваши шрифты .vlw не будут работать с Processing.js, поэтому вам нужно перейти на шрифты .ttf.
  • Как сказал Джордж, jar-файлы не работают с Processing.js, поэтому вам нужно будет закодировать свой скетч, чтобы не использовать их, или перенести их на собственный JavaScript.
  • @preload для изображений зависит от правильных путей, и я предполагаю, что они неверны, если вы не переместите изображения из папки данных
person Jon Buckley    schedule 02.11.2011

arrow_upward
0
arrow_downward

Вы должны понимать, что Processing.js — это порт JavaScript или язык Processing, и поскольку JavaScript отличается от Java, вы не сможете использовать библиотеки .jar с Processing.js, если только вы пишете/находите порты библиотек на JavaScript.

Взгляните на этот ответ для более подробной информации.

person George Profenza    schedule 01.11.2011

arrow_upward
0
arrow_downward

Processing js будет обрабатывать шрифты, отличные от Processing Java. При обработке шрифты Java загружаются с вашего компьютера. Слишком см. список ваших шрифтов, запустите это.

size(200, 200);
String[] fontList = PFont.list();
printArray(fontList);

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

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

/* @pjs
crisp=true;
font=/yourfont.ttf;
*/

Затем в настройках укажите ссылку на шрифт. (Здесь у меня было несколько проблем) Я загружал lineto-brown-pro-bold.ttf и должен был сослаться на него под Brown, хотя в моем списке шрифтов это было Brown-bold. Добавьте эту строку в настройки.

font_name = createFont("/yourfont.ttf", 32);

и в вашем использовании ничьей

textFont(font_name);

Итак, весь код

    /* @pjs
    crisp=true;
    font=/yourfont.ttf;
    */

    PFont font_name;
    void setup() {
    size (200, 330);
    background (34);
    font_name = createFont("/yourfont", 32);
    smooth();
    }

    void draw() {
    background (34);
    textFont(font_name);
    textSize(100);
    fill(255);
    text ("futura in pjs", 20, 310);
    }

Для получения дополнительной информации ознакомьтесь с документацией по обработке.js http://processingjs.org/reference/font/ а также хороший пример и напишите на http://alsoko.net/processing.js-custom-fonts/

person Sabba Keynejad    schedule 03.03.2017