A guided tour of your first steps using D3.

Mike Bostock

Learn D3: Introduction

Learn D3: By Example

Learn D3: Data

Learn D3: Scales

Learn D3: Shapes

Learn D3: Animation

Learn D3: Joins

Learn D3: Interaction

Learn D3: Further Topics

D3 Documentation

Learn D3

it is accessible through the notebook menu or by clicking the paperclip symbol

DuanShuaiShuai

there's not files in the "next" version, you need to use "classic"

Cristi Constantin

There are files in Next (which is now Observable’s default editor) as described above. However in Next the side pane is called “Data” and shows file attachments alongside databases and cloud files.

Isn't it that the `await` keyword can only be used inside an `async` function? Does this mean that (conceptually) an Observable cell is implicitly an async function?

Noah Song

Yes. Observable detects when a cell has a top-level await or yield, and turns the body of the cell into an async function or generator function (or async generator function) as needed. https://observablehq.com/@observablehq/introduction-to-promises

Careful Safari users! This does not work in here, but it does in Chrome. I am a total newbie in here still but found this online: https://github.com/diegomura/react-pdf/issues/536 saying that safari and the WebToolKit do not get along well together.

Maybe I am doing something wrong? The only thing I know is that this worked flawlessly in Chrome but not in Safari. You pros tell me.

Jesús Enrique Rascón

It works for me in Safari. But I wouldn't be surprised if a certain version of Safari doesn't support this. Apple sometimes does its own browser things with Safari.

It works for me in Safari. In what way is it now working for you?

Are you copying and pasting emojis in? Doesn't seem like there is support for GH style emojis with :name:

Elliot Hershberg

array is same as above, without autoType.

Here each date value is a Date instance, and each temperature value is a number; above they are strings.

This doesn't _look_ like it's on purpose...

It’s demonstrating what happens if you attempt to reference a local variable from another cell: you get a runtime error because the local variable is out of scope.

stefan bund

I’m referring to the color shown in the Observable inspector, which uses teal for dates and numbers, and blue for strings.

to my eyes, it is difficult to distinguish the string in blue vs. the teal dates and numbers. I can only tell by "string".

Sophie Sun

How did you display this sunny cloudy icon? 🌤