Processing:Примеры/Загрузка и сохранение JSON-данных: различия между версиями

Материал из Онлайн справочника
Перейти к навигацииПерейти к поиску
Нет описания правки
Нет описания правки
Строка 4: Строка 4:
{{Myagkij-редактор}}
{{Myagkij-редактор}}


{{Черновик}}
 


=Описание<ref>[https://processing.org/examples/loadsavejson.html processing.org - Loading JSON Data by Daniel Shiffman.]</ref>=
=Описание<ref>[https://processing.org/examples/loadsavejson.html processing.org - Loading JSON Data by Daniel Shiffman.]</ref>=
Строка 324: Строка 324:
|Высота логотипа издателя для schemaNewsArticle=45
|Высота логотипа издателя для schemaNewsArticle=45
}}
}}
{{Навигационная таблица/Справочник языка Processing}}
{{Навигационная таблица/Портал/Processing}}
{{Навигационная таблица/Processing/Примеры}}
{{Навигационная таблица/Телепорт}}

Версия от 11:59, 20 мая 2023


Перевод: Максим Кузьмин
Проверка/Оформление/Редактирование: Мякишев Е.А.



Описание[1]

Этот скетч-пример показывает, как при помощи метода loadJSON() считывать данные из JSON-файла, а затем делать из этих данных графические объекты.

JSON-файл выглядит следующим образом: { "bubbles": [ { "position": { "x": 160, "y": 103 }, "diameter": 43.19838, "label": "Happy" }, { "position": { "x": 372, "y": 137 }, "diameter": 52.42526, "label": "Sad" } ] }.

Пример

// массив с объектами-пузырями «Bubble»:
Bubble[] bubbles;
// объект JSONObject:
JSONObject json;

void setup() {
  size(640, 360);
  loadData();
}

void draw() {
  background(255);
  // показываем все пузыри:
  for (Bubble b : bubbles) {
    b.display();
    b.rollover(mouseX, mouseY);
  }
  //
  textAlign(LEFT);
  fill(0);
  text("Click to add bubbles.", 10, height-10);
   //  "Кликните, чтобы нарисовать пузырь"
}
 void loadData() {
  // загружаем JSON-файл;
  // советуем вписать полный путь –
  // пока проблема с путем не будет решена:
  json = loadJSONObject("data.json");

  JSONArray bubbleData = json.getJSONArray("bubbles");

  // размер массива объектов «Bubble» определяется
  // общим количеством XML-элементов под названием «bubble»:
  bubbles = new Bubble[bubbleData.size()]; 

  for (int i = 0; i < bubbleData.size(); i++) {
    // считываем все объекты в массиве:
    JSONObject bubble = bubbleData.getJSONObject(i); 
    // считываем позицию объекта:
    JSONObject position = bubble.getJSONObject("position");
    // считываем из данных о позиции координаты X и Y:
    int x = position.getInt("x");
    int y = position.getInt("y");
    
    // считываем диаметр и текст:
    float diameter = bubble.getFloat("diameter");
    String label = bubble.getString("label");

    // помещаем объект в массив:
    bubbles[i] = new Bubble(x, y, diameter, label);
  }
}

 void mousePressed() {
  // создаем новый пузырь в виде объекта JSONObject:
  JSONObject newBubble = new JSONObject();

  // задаем новую позицию объекта в виде объекта JSONObject:
  JSONObject position = new JSONObject();
  position.setInt("x", mouseX);
  position.setInt("y", mouseY);

  // добавляем в новый пузырь данные о позиции:
  newBubble.setJSONObject("position", position);

  // добавляем в новый пузырь диаметр и текст:
  newBubble.setFloat("diameter", random(40, 80));
  newBubble.setString("label", "New label");

  // добавляем новый пузырь в массив:
  JSONArray bubbleData = json.getJSONArray("bubbles");
  bubbleData.append(newBubble);

  if (bubbleData.size() > 10) {
    bubbleData.remove(0);
  }

  // сохраняем новые данные:
  saveJSONObject(json,"data/data.json");
  loadData();
}




// класс «Bubble»

class Bubble {
  float x,y;
  float diameter;
  String name;
  
  boolean over = false;
  
  // создание «Bubble»:
  Bubble(float x_, float y_, float diameter_, String s) {
    x = x_;
    y = y_;
    diameter = diameter_;
    name = s;
  }
  
  // проверяем, находится ли курсор над пузырем:
  void rollover(float px, float py) {
    float d = dist(px,py,x,y);
    if (d < diameter/2) {
      over = true; 
    } else {
      over = false;
    }
  }
  
  // показываем пузырь:
  void display() {
    stroke(0);
    strokeWeight(2);
    noFill();
    ellipse(x,y,diameter,diameter);
    if (over) {
      fill(0);
      textAlign(CENTER);
      text(name,x,y+diameter/2+20);
    }
  }
}

См.также

Внешние ссылки