Overview

/

Your First Chart

Your First Chart

You only need the core xy package to create, display, and export a chart. The same chart object works in a Python script and a notebook; only the final display line changes.

If XY is not installed yet, follow Installation.

Script path: export interactive HTML

Save this as first_chart.py:

Run it, then open the scatter.html file it writes next to the script:

This is the chart it produces, live:

scatter.html is self-contained. Hover, pan, zoom, and the built-in controls run locally without a Python process or network connection. The seeded random generator keeps the example reproducible while filling the plot with enough points to make those interactions useful.

Notebook path: display a live widget

Run this cell in Jupyter, JupyterLab, VS Code, Colab, Marimo, or another compatible anywidget frontend:

Leaving chart as the final expression displays the interactive widget. Use chart.show() when an explicit display call is clearer. See Notebooks for supported hosts, callbacks, and troubleshooting.

What each part does

  • scatter() binds the x/y values and describes the rendered marks.
  • x_axis() and y_axis() add labeled axes.
  • scatter_chart() composes the marks, axes, title, interactions, and output methods into one Chart.
  • to_html(), to_png(), to_svg(), show(), and widget() all use that same chart; changing output does not require rebuilding it.

Same code, millions of points

Those four values are a placeholder, not a limit. Hand the same mark a few million points and nothing else in the script changes: XY switches the scatter to a screen-bounded density view and keeps pan, zoom, and hover smooth.

Zoom in and the view refines back toward exact points. Read Large data and performance for how the density switch works.

Choose your next step

Built with Reflex