Platform
Resources
Pricing
Sign in
Get started
Matt White
Just a guy
Workspace
Fork
Published
By
Matt White
Edited
Jul 14, 2021
Importers
2
Insert cell
md
`# Ticker Values Main Chart`
Insert cell
chart
=
{
// define our base line chart of stock prices
const
line
=
vl
.
markLine
(
)
.
params
(
brush
)
.
encode
(
vl
.
x
(
)
.
fieldT
(
'Date'
)
,
//vl.y().fieldQ('Close').scale({type: 'log'}),
vl
.
y
(
)
.
fieldQ
(
'Close'
)
,
vl
.
color
(
)
.
fieldN
(
'Symbol'
)
.
scale
(
{
domain
:
ticker_check
,
scheme
:
'category10'
}
)
,
vl
.
tooltip
(
'Close'
)
,
)
;
return
vl
.
data
(
ticker_data
)
.
layer
(
line
)
.
width
(
700
)
.
height
(
400
)
.
render
(
)
}
Insert cell
viewof
ticker_check
=
checkbox
(
{
options
:
tickers
,
value
:
[
"BTC-USD"
,
"ETH-USD"
]
}
)
Insert cell
viewof
event_check
=
checkbox
(
{
options
:
event_type
,
value
:
[
"BTC History"
]
}
)
Insert cell
event_type
=
[
'BTC History'
,
'Global'
,
'Elon'
,
'Financial'
]
Insert cell
brush
=
vl
.
selectInterval
(
)
.
encodings
(
'x'
)
.
name
(
'brush'
)
Insert cell
tickers
=
[
'BTC-USD'
,
'ETH-USD'
,
'AAPL'
,
'TSLA'
,
'MSFT'
,
'NVDA'
,
'SQ'
,
'PYPL'
,
'MSTR'
,
'JPM'
,
'^IXIC'
,
'^DJI'
,
'^GSPC'
,
'GC=F'
,
"CL=F"
]
Insert cell
ticker_data
=
FileAttachment
(
"tickers_full.csv"
)
.
csv
(
)
Insert cell
event_data
=
FileAttachment
(
"events.csv"
)
.
csv
(
)
Insert cell
import
{
vl
}
from
'@vega/vega-lite-api-v5'
Insert cell
embed
=
require
(
"vega-embed@6"
)
Insert cell
import
{
slider
,
button
,
select
,
text
,
radio
,
checkbox
,
number
}
from
"@jashkenas/inputs"
Insert cell
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Try it for free
Learn more
Fork
View
Export
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
chart
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
ticker_check
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
event_check
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
event_type
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
brush
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
tickers
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
ticker_data
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
event_data
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
embed
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML