stocks = FileAttachment("data/big_tech_stock_prices.csv").csv({ typed: true })
tickers = ["AAPL","ADBE","IBM","META", "GOOGL"]
viewof selectStock = Inputs.select(tickers, {label:"Stock", value: "GOOGL"})
filtered_stocks = stocks.filter(d => d.stock_symbol === selectStock)
Plot.plot({
width:1000,
x: {label:''},
y: {label:'Close ($)', grid:true},
marks: [
Plot.areaY(filtered_stocks, {x: "date", y: "close", fillOpacity: 0.3, fill:'#4197FF'}),
Plot.lineY(filtered_stocks, {x: "date", y: "close", stroke:'#4197FF'}),
Plot.ruleY([0])
]
})Hi, I’m Tanya!
- Independent data consultant, specializing in data analysis and visualization design
- Previously worked in insurance industry
- Fell in love with R via #TidyTuesday
- Data geek based in St. Pete, FL
Data Viz Learning Journey
Started off with building visuals in R. Then I wanted to get into more interactive visuals…
- What is node.js?
- What is D3? And svg?
- What IDE should I use?
- Omg where do I start
A Less Intimidating Way to Start…
Observable Notebooks = my new playground for data viz experiments
- No fuss with installation
- Accessible community, lots of resources
- Observable Plot felt familiar
- Integrate easily with my Quarto site
What is Observable Plot?
Free and open-source JS library for data viz
Under the hood - D3!
Inspired by the grammar of graphics
Create visuals with layered marks
Combine with inputs to create interactive plots
Let’s Get Plotting!
Reroute to this Observable Notebook.
