PostsDemoVisualsVega RemoteA Spec Kept In Its Own File
Copied copy path!

vega-remote

Charts that pull their data from the internetURL copied

A spec kept in its own fileURL copied

Every chart above carries its spec inline. src reads it from a file instead, so a long spec does not bury the prose around it.

Scatterplot matrix: shift-drag to brush, drag to pan
```vega title="..." src="interactive-scatter.json" height=560 actions=true
```

That is interactive-scatter.json: a nine-panel repeat over horsepower, acceleration and mileage, with two interval selections bound to different modifiers.

  • Drag inside any panel to pan, and scroll to zoom — the grid selection is bind: "scales", so it moves the axes themselves.
  • Shift-drag to brush. That selection resolves as a union across all nine panels, so points stay coloured by origin in every panel at once and grey everywhere they fall outside the brush.

src follows the same guard as a data file: relative to this document, under the content root, ending in .json, .yaml or .yml.

Two things about this spec are worth copying. It is a repeat, which is a composed spec, so it never receives the container width — Vega-Lite sizes the nine panels itself, and the result is centred in the column. And its data.url is absolute: a relative url in a spec resolves against the page that renders it, not against wherever the spec file lives.