我有一个 redraw() 函数,它旨在停止当前的 draw() 循环,从 DOM 中检索新的初始化值,并恢复绘图,就好像这些值是最初的值一样。
但是onchange中的“redraw()”是看不到Processing.js的redraw()函数的,所以改变输入域的值是没有效果的。如果“redraw()”更改为“alert('changed!')”,弹出窗口显示“changed!”,所以我们知道问题不是 onchange,而是无法从Processing.js 文件。
wolfram-automata.html
<p>Rule: <input onchange="redraw()" id="rule" value="110" size="4" /></p>
<canvas id="sketch" data-processing-sources="wolfram-automata.pjs"></canvas>
<script src="processing-1.1.0.min.js"></script>
wolfram-自动机.pjs
processing.setup = function () {
size(bounds, steps);
background(white);
rule = parseInt(document.getElementById("rule").value, 10);
currentState = initState(bounds);
rule = bits(rule);
}
processing.draw = function () {
drawState(currentState, currentStep);
currentState = step(currentState, rule);
currentStep++;
if (currentStep >= steps) { noLoop(); }
}
function redraw() {
println("Redrawing");
noLoop();
currentState = [];
currentStep;
processing.setup();
loop();
}
最佳答案
这可能是一个范围界定问题。尝试在窗口上显式设置重绘。
代替:
function redraw() { ...
尝试:
window.redraw = function() { ...
关于javascript - 如何向 HTML 页面公开 Processing.js 函数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5329266/