2

私のphpスクリプトjson_encodesこれ：

[{"x":"20","y":"24","name":"NewNov"},{"x":"20","y":"70","name":"Tito"}]

しかし、p5.js プログラムでこの情報を抽出する方法がわかりません。

たとえば、「x」、「y」、「名前」を使用して、適切な場所に正しい名前で円を描く必要があります。

スクリプトでloadJSONを使用しましたが、変数があります-

data = loadJSON()

しかし、たとえば、JSON から「x」コンポーネントを取得するにはどうすればよいでしょうか?

var radius;

function preload() {
    var url = 'http://localhost/planetTrequest.php';
    radius = loadJSON(url);
}

function setup() {
    createCanvas(300, 300);
    background(153);
    noLoop();
}

function draw() {
    background(200);
    textSize(15);
    text(radius.x, 10, 30);
    fill(0, 102, 153);
}
4

4 に答える 4

0

簡単な例として

次のような JSON として返される入力があるとします。

var data = [{"x":"20","y":"24","name":"NewNov"},{"x":"20","y":"70","name":"Tito"}];

その配列の各要素からx, y,を抽出したい場合は、次のようにします。name

for (var element of data){
    // Your element is in format : 
    // {"x":"20","y":"24","name":"NewNov"}

    // To get X
    var x = element.x; // or element["x"]
    // To get Y
    var y = element.y; // or element["y"]
    // To get name
    var name = element.name; // or element["name"]

    // Do whatsoever with your element
    // ...
}

** JSON はオブジェクトです**

key上記のコードで示したように、JSON データの任意のプロパティにすばやくアクセスできます。.基本的に、プロパティまたは[]配列インデックス表記でアクセスする 2 つの方法があります。

于 2015-06-13T13:12:31.197 に答える
0

loadJSON非同期です。つまり、データはすぐには利用できません。p5 が呼び出されないため、またはすべての非同期呼び出しが解決されるまでloadJSON、内部で呼び出されたときに返されるオブジェクトのプロパティを設定することによって機能します。preloadsetupdrawpreload

ドキュメントによると：

loadJSON()内部で呼び出すと、呼び出されるpreload()前に操作が完了することが保証されます。setup()draw()

通常の設定は次のとおりです。

let data; // expose the result object's variable globally

function preload() {
  /* endpoint to get an example JSON with a `title` property: 
      {"title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit"} 
  */
  const url = "https://jsonplaceholder.typicode.com/posts/1";

  data = loadJSON(url);    // get a reference to a placeholder object that 
                           // will be filled in before draw/setup

  console.log(data.title); // guaranteed to be undefined!
                           // p5 hasn't waited for the call to complete yet
}

function setup() {
  createCanvas(500, 150);
  noLoop();
  console.log(data.title); // data.title is defined!
}

function draw() {
  background(200);
  textSize(15);
  textAlign(CENTER, CENTER);
  text(data.title, width / 2, height / 2); // data.title is defined!
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.2.0/p5.js"></script>

loadJSONの外部で使用する場合preload、p5 はロードが終了するのを待つために特別なことは何もしません。ドキュメントloadJSONでは、応答データが到着したときに呼び出されるコールバックを提供することを推奨しています。

function setup() {
  const url = "https://jsonplaceholder.typicode.com/posts/1";
  //let title; // wrong! this can't expose data for this block to access
  
  loadJSON(url, data => {
    //title = data.title; // wrong! this won't set the outer 
                          // variable let title; in time for 
                          // the bottom console.log(title)
    
    // correct! now you can consume the data
    console.log(data.title);
  });
  
  //console.log(title); // wrong! title will be undefined here
  noLoop();
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.2.0/p5.js"></script>

loadJSONJSON データを取得する唯一の方法ではないことに注意してください。他のライブラリを使用してデータを取得できます。loadJSONp5 関数の外では定義されません。ノードでaxiosは、良い賭けです。ブラウザでfetchは、良い賭けです。

上記のコールバック パターンの詳細なガイドについては、非同期呼び出しからの応答を返すも参照してください。コールバックを約束するか、このスレッドのテクニックを使用して、必要に応じて機能する方法で応答からデータにアクセスできます (これは、p5 の範囲と の通常の使用例を超えていますloadJSON)。

于 2021-02-21T03:55:14.223 に答える