Platform
Solutions
Resources
Pricing
Sign in
Sign up
David Maynard
Retired Computer Scientist: SRI-ARC (Engelbart), Xerox PARC, Xerox SDS, Electronic Arts, SGI, Google, Box
Workspace
Fork
Public
By
David Maynard
Edited
Jul 11, 2023
1
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
HTL-MAR-FiddlerCrabBodySize.csv
Filter
Columns
Sort
Slice
Save
Type Table, then Shift-Enter. Ctrl-space for more options.
Insert cell
Insert cell
Insert cell
Insert cell
crabsJS
=
crabs
.
map
(
(
d
)
=>
(
{
lat
:
d
.
Latitude
,
site
:
d
[
"Site "
]
,
airTempC
:
d
.
MATA
,
waterTempC
:
d
.
MATW
,
sizeMm
:
d
.
carapace_width
}
)
)
Insert cell
Insert cell
Insert cell
Insert cell
crabsJS
Clear All
Swap X/Y
Customize
X
airTempC
Y
sizeMn
Color
#65a7ff
Size
—
Facet X
—
Facet Y
—
Mark
Auto
Type Chart, then Shift-Enter. Ctrl-space for more options.
Insert cell
viewof
pickSize
=
Inputs
.
range
(
[
0
,
100
]
,
{
label
:
"Amount"
,
step
:
1
}
)
Insert cell
Plot
.
plot
(
{
x
:
{
label
:
"air temp c"
}
,
marks
:
[
Plot
.
dot
(
crabsJS
,
{
x
:
"airTempC"
,
y
:
"sizeMn"
,
stroke
:
"#65a7ff"
,
fill
:
"purple"
,
tip
:
true
,
r
:
pickSize
,
opacity
:
0.5
,
tip
:
true
}
)
]
}
)
Insert cell
Insert cell
Insert cell
Plot
.
plot
(
{
marks
:
[
Plot
.
dot
(
crabsJS
,
{
x
:
"lat"
,
y
:
"sizeMm"
}
)
]
}
)
Insert cell
Insert cell
Insert cell
ML
=
require
(
"https://www.lactame.com/lib/ml/6.0.0/ml.min.js"
)
Insert cell
Insert cell
crabsML
=
new
ML
.
SimpleLinearRegression
(
crabsJS
.
map
(
(
d
)
=>
d
.
lat
)
,
crabsJS
.
map
(
(
d
)
=>
d
.
sizeMm
)
)
Insert cell
crabsML
.
slope
Insert cell
Insert cell
Insert cell
Plot
.
plot
(
{
marks
:
[
Plot
.
dot
(
crabsJS
,
{
x
:
"lat"
,
y
:
"sizeMm"
,
tip
:
true
}
)
,
Plot
.
linearRegressionY
(
crabsJS
,
{
x
:
"lat"
,
y
:
"sizeMm"
}
)
,
Plot
.
frame
(
)
]
,
x
:
{
label
:
"Latitude"
}
,
y
:
{
label
:
"Carapace Size (mm)"
}
}
)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
One platform
to build and deploy the best data apps
Experiment and prototype by building visualizations in live JavaScript notebooks. Collaborate with your team and decide which concepts to build out.
Use Observable Framework to build data apps locally. Use data loaders to build in any language or library, including Python, SQL, and R.
Seamlessly deploy to Observable. Test before you ship, use automatic deploy-on-commit, and ensure your projects are always up-to-date.
Try it for free
Learn more
Fork
View
Export
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
crabs
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
File attachments
HTL-MAR-FiddlerCrabBodySize.csv
CSV
Databases
Filter
Column
Operator
Columns
Sort
Column
Direction
Descending
Ascending
Slice
From
Start
To
End
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
crabsJS
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
Cells
crabsJS
File attachments
HTL-MAR-FiddlerCrabBodySize.csv
CSV
Customize
Clear
Title
Subtitle
Caption
Height
Width
Auto
Full
Margin
Top
Right
Bottom
Left
Inset
Legend
Auto
None
X label
X scale
Auto
Scale
Auto
linear
log
sqrt
symlog
point
band
X options
Grid
Reverse
Y label
Y scale
Auto
Scale
Auto
linear
log
sqrt
symlog
point
band
Y options
Grid
Reverse
Color scheme
Auto
Color scheme
Auto
Default color schemes
Sequential
Diverging
Cyclical
Categorical
Sequential color schemes
Blues
Greens
Greys
Oranges
Purples
Reds
Turbo
Viridis
Inferno
Magma
Plasma
Cividis
Warm
Cool
BuGn
BuPu
GnBu
OrRd
PuBuGn
PuBu
PuRd
RdPu
YlGnBu
YlGn
YlOrBr
YlOrRd
Diverging color schemes
BrBG
PRGn
PiYG
PuOr
RdBu
RdGy
RdYlBu
RdYlGn
Spectral
Cyclical color schemes
Sinebow
Turbo
Categorical color schemes
Category10
Accent
Dark2
Paired
Pastel1
Pastel2
Set1
Set2
Set3
Tableau10
Color scale
Auto
Scale
Auto
linear
log
sqrt
symlog
categorical
ordinal
Color options
Reverse
Reducer
—
Auto
—
count
distinct
sum
min
max
mean
median
mode
Field
—
Reducer
—
Auto
—
count
distinct
sum
min
max
mean
median
mode
Field
—
Reducer
—
Auto
—
count
distinct
sum
min
max
mean
median
mode
Field
—
Reducer
—
Auto
—
count
distinct
sum
min
max
mean
median
mode
Field
—
Field
—
Field
—
Mark
Auto
—
bar
dot
line
area
rule
pickSize
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
ML
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
crabsML
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML