You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
warn about implicit display gotcha in the getting-started example (#813)
* warn about implicit display gotcha in the getting-started example
* change getting-started first example to use display
* change getting-started Plot.plot example to use display
* prettier
---------
Co-authored-by: Mike Bostock <[email protected]>
Now let’s add a chart using <ahref="./lib/plot">Observable Plot</a>. Framework includes a variety of <ahref="./javascript/imports#implicit-imports">recommended libraries</a> by default, including `Plot`, and you can always <ahref="./javascript/imports">import more</a> from npm. Replace the `display(forecast)` code block with the following code:
418
418
419
419
```js run=false
420
-
Plot.plot({
421
-
title:"Hourly temperature forecast",
422
-
x: {type:"utc", ticks:"day", label:null},
423
-
y: {grid:true, inset:10, label:"Degrees (F)"},
424
-
marks: [
425
-
Plot.lineY(forecast.properties.periods, {
426
-
x:"startTime",
427
-
y:"temperature",
428
-
z:null, // varying color, not series
429
-
stroke:"temperature",
430
-
curve:"step-after"
431
-
})
432
-
]
433
-
})
420
+
display(
421
+
Plot.plot({
422
+
title:"Hourly temperature forecast",
423
+
x: {type:"utc", ticks:"day", label:null},
424
+
y: {grid:true, inset:10, label:"Degrees (F)"},
425
+
marks: [
426
+
Plot.lineY(forecast.properties.periods, {
427
+
x:"startTime",
428
+
y:"temperature",
429
+
z:null, // varying color, not series
430
+
stroke:"temperature",
431
+
curve:"step-after"
432
+
})
433
+
]
434
+
})
435
+
);
434
436
```
435
437
436
438
<divclass="note">Because this is JSON data, <code>startTime</code> is a <code>string</code> rather than a <code>Date</code>. Setting the <code>type</code> of the <code>x</code> scale to <code>utc</code> tells Plot to interpret these values as temporal rather than ordinal.</div>
0 commit comments