Adapt a chart snippet for your data
1 of 8

Observable includes a large number of charts that you can easily add to your notebook from the new cell menu. By default these chart snippets include sample data, which you'll want to replace with your own. In this guide, we'll look at how to insert a chart, connect it to a different dataset, then use aggregation to wrangle that data into a useable format.

First, let's insert a line chart. Click a + button on the left and select the Line chart from the list.

This inserts an Observable Plot code snippet into your notebook. Run it by pressing Shift-Enter or clicking the Run cell button in the top right of the cell.

The sample data included in this snippet shows Apple's stock price (AAPL) over a number of years. The numbers on the Y axis are US dollars, so let's format them appropriately. Add a comma after the closing square bracket ] and then insert this line to set the format for the vertical tick marks:

  ],
  y: {tickFormat: "$s"}

We now have a nice chart of Apple's stock price, but how can you use this code to show different data?