docs/index.md

metadata

theme: alt
toc: false

Hello, Observable Framework

Welcome to your new project! Edit docs/index.md to change this page.

Get started↗︎

${ resize((width) => Plot.plot({ title: "Your awesomeness over time 🚀", subtitle: "Up and to the right!", width, y: {grid: true, label: "Awesomeness"}, marks: [ Plot.ruleY([0]), Plot.lineY(aapl, {x: "Date", y: "Close", tip: true}) ] })) }

${ resize((width) => Plot.plot({ title: "How big are penguins, anyway? 🐧", width, grid: true, x: {label: "Body mass (g)"}, y: {label: "Flipper length (mm)"}, color: {legend: true}, marks: [ Plot.linearRegressionY(penguins, {x: "body_mass_g", y: "flipper_length_mm", stroke: "species"}), Plot.dot(penguins, {x: "body_mass_g", y: "flipper_length_mm", stroke: "species", tip: true}) ] })) }

---

Next steps

Here are some ideas of things you could try…

Chart your own data using Plot and FileAttachment. Make it responsive using resize.

Create a new page by adding a Markdown file (whatever.md) to the docs folder.

Add a drop-down menu using Inputs.select and use it to filter the data shown in a chart.

Write a data loader that queries a local database or API, generating a data snapshot on build.

Import a recommended library from npm, such as Leaflet, GraphViz, TeX, or DuckDB.

Ask for help, or share your work or ideas, on the Observable forum.

Visit Framework on GitHub and give us a star. Or file an issue if you’ve found a bug!