动态地“卸载”从画布处理JS草图 [英] Dynamically "unload" a Processing JS sketch from canvas

问题描述

我正在使用一些javascript来允许用户使用以下方法动态加载素材到click元素：

I'm using some javascript to allow users to dynamically load a sketch on click to a canvas element using:

Processing.loadSketchFromSources （'canvas_id'，['sketch.pde']）;

Processing.loadSketchFromSources('canvas_id', ['sketch.pde']);

如果我再次调用Processing.loadSketchFromSources（...） （或第三...）时间，它将第二个（或第三个......）。pde文件加载到画布上，这是我所期望的。

If I call Processing.loadSketchFromSources(...) a second (or third...) time, it loads a second (or third...) .pde file onto the canvas, which is what I would expect.

I '希望用户能够点击另一个链接加载不同的草图，有效地卸载前一个草图。有没有我可以调用的方法（或者我可以使用的技术）来检查Processing是否有另一个草图在运行，如果有，请告诉它先卸载它？

I'd like for the user to be able to click another link to load a different sketch, effectively unloading the previous one. Is there a method I can call (or a technique I can use) to check if Processing has another sketch running, and if so, tell it to unload it first?

是否有某种Processing.unloadSketch（）方法我忽略了？我可以简单地删除画布DOM对象并重新创建它，但是当我需要针时，（1）似乎使用锤子，（2）它会导致我想要避免的屏幕闪烁。

Is there some sort of Processing.unloadSketch() method I'm overlooking? I could simply drop the canvas DOM object and recreate it, but that (1) seems like using a hammer when I need a needle, and (2) it results in a screen-flicker that I'd like to avoid.

我不是JS专家，但我已经尽力查看processing.js源代码，看看其他功能可能存在，但我还是碰壁了。我想也许我可以查看Processing.Sketches.length来查看是否已经加载了某些东西，但只是将它从数组中弹出似乎不起作用（不认为它会）。

I'm no JS expert, but I've done my best to look through the processing.js source to see what other functions may exist, but I'm hitting a wall. I thought perhaps I could look at Processing.Sketches.length to see if something is loaded already, but simply pop'ing it off the array doesn't seem to work (didn't think it would).

我正在使用ProcessingJS 1.3.6。

I'm using ProcessingJS 1.3.6.

推荐答案

截至Processing.js 1.4。 8，安德鲁接受的答案（以及我在这里找到的其他答案）似乎不再适用了。

As of processing.js 1.4.8, Andrew's accepted answer (and the other answers I've found in here) do not seem to work anymore.

这对我有用：

    var pjs = Processing.getInstanceById('pjs');
    if (typeof pjs !== "undefined") {
      pjs.exit();
    }

    var canvas = document.getElementById('pjs')
    new Processing(canvas, scriptText);

其中 pjs 是画布的id正在运行潦草的元素。

where pjs is the id of the canvas element where the scrips is being run.

这篇关于动态地“卸载”从画布处理JS草图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！