1

有望な p5.js ライブラリを使用して単純な Web アプリを作成しようとしていますが、行き詰まっており、先に進む方法がわかりません。次の行が機能しない理由は本当に謎です。単純なテキスト ファイルを読み込もうとしていますが、読み込めません。明らかに空ではないのに、空だと言い続けます。私は、p5js の Web サイトにあるデフォルトの例と異なることは何もしていません。

実際、ロードする文字列をhttp://quarx.asfa.gr/data.txtに置き換えて、デフォルトの例も試しました 。私のサーバーは、文字列を送信していることを示しています... p5jsが何をしているのかわかりません。何か案が？コードは以下のとおりです。

var result;
var processedResult;

function setup() {
   createCanvas(windowWidth, windowHeight);
   var URL = "http://quarx.asfa.gr/data.txt";
   result = loadStrings(URL, getHistoryState);
}

function draw() {
   background(0);
   ellipse(50, 50, 80, 80);
   textSize(50);
   text(processedResult, 300,300);
}

function getHistoryState() {
   processedResult = result;
}
4

2 に答える 2

1

スクリプト/ページがホストされているのと同じドメインからデータをロードする必要があります。

Same-Origin-Policyを調べてください。特にこのテーブル: ここに画像の説明を入力

于 2014-08-29T17:09:26.703 に答える
0

テキストを描画する関数 は、draw()の直後に API によって呼び出されます。そのため、コールバック ( ) が任意の値を に設定するsetup()前に、可能性が最も高くなります。getHistoryState()processedResult

次のようdraw()に末尾に追加します。getHistoryState()

function getHistoryState() {
   processedResult = result;
   draw();
}

または単に を取り除くとgetHistoryState()、次のようになります。

var result;

function setup() {
   createCanvas(windowWidth, windowHeight);
   var URL = "http://quarx.asfa.gr/data.txt";
   result = loadStrings(URL, draw);
}

function draw() {
   background(0);
   ellipse(50, 50, 80, 80);
   textSize(50);
   text(result, 300,300);
}

しかし、どちらの場合も、draw()2 回呼び出されます (setup()コールバックの後とその後)。それが望ましくない場合は、別の名前に変更draw()します (またはif /がまだ空であるdraw()場合に returnの先頭にステートメントを追加します)。processedResultresult

于 2014-08-29T17:22:05.773 に答える