# What Datasets Are Used with A2UI: Sample Data and Binding Guide

> Explore the five sample JSON datasets used with google A2UI for populating UI components. Understand data binding with this comprehensive guide.

- Repository: [Google/A2UI](https://github.com/google/A2UI)
- Tags: deep-dive
- Published: 2026-03-13

---

**The google/A2UI repository ships with five self-contained JSON datasets—restaurant listings, employee contact records, searchable contact directories, pie chart statistics, and geographic map coordinates—that agents load to populate UI components via `dataModelUpdate` messages.**

A2UI (Agent-to-UI) is an open-source framework from Google that renders dynamic interfaces by binding runtime agent data to component catalogs. Understanding what datasets are used with A2UI helps developers implement the **data-driven architecture**, where JSON-serializable payloads replace static UI content without modifying frontend code.

## Sample Datasets Included in the Repository

The reference implementations rely on small, static JSON files located in the `samples/agent/adk/` directory. These files act as mock databases that sample agents query and transform into UI updates.

### Restaurant Finder Data

The **Restaurant Finder** ADK agent uses [`samples/agent/adk/restaurant_finder/restaurant_data.json`](https://github.com/google/A2UI/blob/main/samples/agent/adk/restaurant_finder/restaurant_data.json) to populate list views. This dataset contains an array of objects with fields for `name`, `detail`, `imageUrl`, `rating`, `infoLink`, and `address`. The agent reads this file and emits `dataModelUpdate` messages that bind each restaurant field to a `List` component using JSON-Pointer syntax.

### Contact Records for Multiple Surfaces

The **Contact Multiple Surfaces** sample demonstrates binding one dataset to varied UI representations (cards, tables, and maps). It sources data from [`samples/agent/adk/contact_multiple_surfaces/contact_data.json`](https://github.com/google/A2UI/blob/main/samples/agent/adk/contact_multiple_surfaces/contact_data.json), which stores employee records including `id`, `name`, `title`, `team`, `location`, `email`, `phone`, `calendar`, and `avatar`. The same schema appears in [`samples/agent/adk/contact_lookup/contact_data.json`](https://github.com/google/A2UI/blob/main/samples/agent/adk/contact_lookup/contact_data.json) for the **Contact Lookup** sample, which adds search and filtering capabilities.

### Chart and Map Data (RizzCharts)

The **RizzCharts** sample illustrates data visualization using two coordinated datasets:

- [`samples/agent/adk/rizzcharts/examples/standard_catalog/chart.json`](https://github.com/google/A2UI/blob/main/samples/agent/adk/rizzcharts/examples/standard_catalog/chart.json) – Contains pie chart items with `label` and `value` properties.
- [`samples/agent/adk/rizzcharts/examples/standard_catalog/map.json`](https://github.com/google/A2UI/blob/main/samples/agent/adk/rizzcharts/examples/standard_catalog/map.json) – Stores geographic points with `latitude`, `longitude`, and `label` for map widgets.

Both files are referenced by the catalog definition in [`samples/agent/adk/rizzcharts/rizzcharts_catalog_definition.json`](https://github.com/google/A2UI/blob/main/samples/agent/adk/rizzcharts/rizzcharts_catalog_definition.json), which declares how chart and map components consume these data paths.

## How Datasets Bind to UI Components

A2UI employs a **catalog-and-model pattern** where datasets never directly render UI elements. Instead, they populate a runtime data model that components reference through declarative bindings.

1. **Catalog Definition** – The UI hierarchy is described in a catalog JSON file (e.g., [`rizzcharts_catalog_definition.json`](https://github.com/google/A2UI/blob/main/rizzcharts_catalog_definition.json)). Components declare data dependencies using JSON-Pointer paths such as `/chart/items[0].label` or `/restaurants[0].rating`.

2. **Data Model Updates** – At runtime, the agent sends A2UI protocol messages. The `dataModelUpdate` payload contains a list of key/value pairs where keys match the catalog's JSON-Pointer paths and values contain the dataset content.

3. **Automatic Rendering** – Angular, React, or Lit renderers observe the data model. When an update arrives, the framework re-renders only the bound components, reflecting the new dataset state without page reloads.

## Loading and Sending Dataset Updates in Code

The following examples demonstrate how agents transform the sample JSON files into `dataModelUpdate` messages consumed by A2UI renderers.

### Python: Streaming Restaurant Data

The Python SDK in [`agent_sdks/python/src/a2ui/a2a.py`](https://github.com/google/A2UI/blob/main/agent_sdks/python/src/a2ui/a2a.py) provides `A2UIClient` and `MessageBuilder` to package updates. This snippet reads [`restaurant_data.json`](https://github.com/google/A2UI/blob/main/restaurant_data.json) and emits field-level updates:

```python
import json
from a2ui import A2UIClient, MessageBuilder

client = A2UIClient()
with open("samples/agent/adk/restaurant_finder/restaurant_data.json") as f:
    restaurants = json.load(f)

updates = []
for i, r in enumerate(restaurants):
    base = f"/restaurants[{i}]"
    updates.extend([
        {"key": f"{base}.name", "valueString": r["name"]},
        {"key": f"{base}.detail", "valueString": r["detail"]},
        {"key": f"{base}.imageUrl", "valueString": r["imageUrl"]},
        {"key": f"{base}.rating", "valueString": r["rating"]},
        {"key": f"{base}.infoLink", "valueString": r["infoLink"]},
        {"key": f"{base}.address", "valueString": r["address"]},
    ])

msg = MessageBuilder().data_model_update(
    surface_id="restaurant-view",
    path="/",
    contents=updates,
)
client.send(msg)

```

### Angular: Binding Chart Datasets

In the Angular implementation of RizzCharts, the component loads [`chart.json`](https://github.com/google/A2UI/blob/main/chart.json) and converts it to the expected update format:

```typescript
import { Component, OnInit } from '@angular/core';
import { A2UIClient, MessageBuilder } from '@a2ui/angular';
import chartData from '../../../../../samples/agent/adk/rizzcharts/examples/standard_catalog/chart.json';

@Component({
  selector: 'app-pie-chart',
  template: `<a2ui-catalog [catalog]="catalog" [dataModel]="dataModel"></a2ui-catalog>`
})
export class PieChartComponent implements OnInit {
  catalog = {};
  dataModel = {};

  ngOnInit() {
    const client = new A2UIClient();
    const updates = chartData.map((item, i) => [
      { key: `/chart/items[${i}].label`, valueString: item.label },
      { key: `/chart/items[${i}].value`, valueNumber: item.value },
    ]).flat();

    const msg = MessageBuilder()
      .dataModelUpdate('sales-dashboard', '/', updates);
    client.send(msg);
  }
}

```

### Lit: Rendering Contact Lists

For Web Components using Lit, the dataset is imported directly and bound to local properties:

```typescript
import { html, LitElement } from 'lit';
import contactData from '../../../../../samples/agent/adk/contact_multiple_surfaces/contact_data.json';

class ContactList extends LitElement {
  static properties = { contacts: { type: Array } };
  contacts = contactData;

  render() {
    return html`
      <ul>
        ${this.contacts.map(c => html`
          <li>
            <img src=${c.imageUrl} alt="Avatar" />
            <strong>${c.name}</strong> – ${c.title}
          </li>
        `)}
      </ul>
    `;
  }
}
customElements.define('contact-list', ContactList);

```

## Key Dataset Files and Schema References

| File Path | Dataset Description |
|-----------|---------------------|
| [`samples/agent/adk/restaurant_finder/restaurant_data.json`](https://github.com/google/A2UI/blob/main/samples/agent/adk/restaurant_finder/restaurant_data.json) | Restaurant listings with metadata for the finder agent. |
| [`samples/agent/adk/contact_multiple_surfaces/contact_data.json`](https://github.com/google/A2UI/blob/main/samples/agent/adk/contact_multiple_surfaces/contact_data.json) | Employee directory for multi-surface rendering demos. |
| [`samples/agent/adk/contact_lookup/contact_data.json`](https://github.com/google/A2UI/blob/main/samples/agent/adk/contact_lookup/contact_data.json) | Searchable contact records for lookup functionality. |
| [`samples/agent/adk/rizzcharts/examples/standard_catalog/chart.json`](https://github.com/google/A2UI/blob/main/samples/agent/adk/rizzcharts/examples/standard_catalog/chart.json) | Statistical data for pie chart visualizations. |
| [`samples/agent/adk/rizzcharts/examples/standard_catalog/map.json`](https://github.com/google/A2UI/blob/main/samples/agent/adk/rizzcharts/examples/standard_catalog/map.json) | Geographic coordinates for map widget binding. |
| [`samples/agent/adk/rizzcharts/rizzcharts_catalog_definition.json`](https://github.com/google/A2UI/blob/main/samples/agent/adk/rizzcharts/rizzcharts_catalog_definition.json) | Catalog defining component schemas and data pointers. |
| [`specification/v0_9/json/basic_catalog.json`](https://github.com/google/A2UI/blob/main/specification/v0_9/json/basic_catalog.json) | Core A2UI schema specification for valid dataset structures. |

## Summary

- **Five sample JSON datasets** ship with google/A2UI: restaurant listings, two contact directories, chart statistics, and map coordinates.
- **JSON-Pointer paths** in catalog definitions determine how UI components consume dataset fields.
- **`dataModelUpdate` messages** transmit dataset contents from the agent to the frontend at runtime.
- **Python, Angular, and Lit SDKs** provide helpers to load JSON files and emit protocol-compliant updates.
- **Schema validation** is guided by [`basic_catalog.json`](https://github.com/google/A2UI/blob/main/basic_catalog.json) in the specification directory.

## Frequently Asked Questions

### Where are the A2UI sample datasets located?

All sample datasets reside under `samples/agent/adk/` in the repository root. Restaurant data lives in `restaurant_finder/`, contact records appear in both `contact_multiple_surfaces/` and `contact_lookup/`, and visualization data is stored in `rizzcharts/examples/standard_catalog/`.

### How do I use my own dataset with A2UI?

Replace any sample JSON file with your own data, ensuring your JSON structure matches the keys referenced in the catalog's JSON-Pointer paths. Update the agent code to load your file path while preserving the `dataModelUpdate` key naming convention (e.g., `/items[0].propertyName`).

### What format should custom datasets follow?

Datasets must be JSON-serializable objects or arrays. The schema is defined in [`specification/v0_9/json/basic_catalog.json`](https://github.com/google/A2UI/blob/main/specification/v0_9/json/basic_catalog.json), which validates component bindings and data types. Each data point intended for UI display must map to a unique JSON-Pointer key used in the catalog definition.

### Can A2UI consume live API data instead of static JSON?

Yes. The sample JSON files are for demonstration only. Production agents can query external APIs, transform the responses into the key/value list format expected by `dataModelUpdate`, and stream live data to A2UI components without changing the frontend rendering logic.