memorandums

日々の生活で問題解決したこと、知ってよかったことなどを自分が思い出すために記録しています。

Processing.jsのメソッドを外?から呼ぶ方法

■経緯(ちょっと長いですが)

数日後の展示会(スマートフォン&モバイルEXPO)に出展のために今年のGWはデモアプリ作りをしています。

既開発のシミュレータをiPadで動作させるためにネイティブアプリの開発方法をおさらいしながら作り始めていたのですが、いろいろ考えるとやはりWebの方が都合が良いと思いまして、数日前から急遽、Processing.jsやjQueryなどを組み合わせてWebアプリ作りをしてきました。

描画部分はProcessingですので半日くらいでできたのですが、入力されたパラメータにしたがって再計算させる部分をどう実装するか。。。悩みました。Processingでダイアログを作るのは結構大変です。Java製のライブラリが動作することは期待できませんし。

そこで、jQuery UIのDialogを利用させてもらい、Dialogでボタンを押したらjQueryajaxでサーバープログラムをコールして、実行結果を受け取りProcessing.jsで再描画する。。。とやろうとしたのですが、最後の「Processing.jsで再描画する」という部分で詰まりました。で、やっと本題です。

■解決方法

前置きのわりに解決方法は簡単でした。ajaxで成功したときの処理に以下を埋込むだけです。ちなみにmobile_toolというスケッチ名でスケッチ内のvoid makeStockTable()という自作メソッドを呼び出している例です。

var p = Processing.getInstanceById('mobiletool');
p.makeStockTable();


参考:calling a processing.js function from javascript / jquery

参考:jQuery & Ajax通信を使ってPHPにPOSTでデータを送信するサンプル