2017-01-11 6 views
1

Я новичок с Processing.js и у меня есть проект, который идет как это:ширина/высота не меняется Processing.js

В test.html у меня есть:

<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Test</title> 
</head> 
<style> 
    body { 
     margin: none; 
     padding: none; 
    } 
</style> 
<body> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/processing.js/1.6.3/processing.min.js"></script> 
    <canvas data-processing-sources="Test.pde"></canvas> 
</body> 
</html> 

В Test.pde у меня есть:

void setup() 
{ 
    size(600,600); 
    PFont fontA = loadFont("sans-serif"); 
    textFont(fontA, 14); 
}; 

println(width); 

void draw(){ 
    background(20, 20, 20); 
}; 

Какие width сек hould be is 600, так как я положил «600 на 600» в функцию size в настройке. Я запускаю это в браузере Firefox, но получаю те же результаты и в Safari.

+0

Что произойдет, если вы поместите весь свой код в один файл '.pde'? –

+0

Ширина по-прежнему отображается как 100, если она находится в одном файле, и только этот файл ссылается в HTML. –

+0

Я не могу воспроизвести вашу проблему. Когда я запускаю ваш код, он работает нормально. Не могли бы вы собрать код [Pen Pen] (http://codepen.io/), который демонстрирует проблему? –

ответ

0

Подумайте, когда происходит заявление println(). Подумайте, когда вызывается функция setup().

Когда ваш код первого чтения, вы определения функция setup(), но вы на самом деле не работает еще. Затем вы распечатываете переменную width, , которая еще не была настроена. Затем вы определяете функцию draw().

После этого платформа обработки вызывает функцию setup() для вас и начинает вызов функции draw() 60 раз в секунду.

Другими словами, ваш код ведет себя точно так, как он должен себя вести.

Если вы хотите использовать переменную width, вы должны сделать это после того, как функция size() была вызвана из вашей setup() функции.