CalendarW3DT Product-Market Fit Dashboard v1 (IPFS and Filecoin data separate)DashboardMarket Cap TreemapInflation ExplorerRandom Walks on Wall StreetMT Dept. Labor & Industry job growth projections, 2018-2028Final Project: What makes an airline succesful?Worksheet: Technical Analysis Dashboard (Assignment)Global access to finance (World Bank Findex)House Buying AnalysisOptions Strategy EvaluationPrimer's Coin Game SimulationOptimal GamblingVisualizing the InvisibleX-MatrixShark Tank: Tech Pitches ExplorationStripeHow old are companies when they IPO?The Limit of Growth
Best Investing Strategy in Metaverse-Related Stocks
dailyData = FileAttachment("finalData-daily.csv").csv({typed: true});
weeklyData = FileAttachment("finalData-weekly.csv").csv({typed: true});
{
const HEIGHT = 300;
const plot1 = vl
.markBar({ tooltip: true, opacity: 0.6 })
.encode(
vl.y()
.sum('TransactionVolume')
.axis({ format: 's' })
.title("Weekly Transaction Volume (B)"),
vl.x()
.fieldT("Date"),
vl.color()
.fieldN("Company")
)
.width(600)
.height(HEIGHT);
const plot2 = vl
.markBar({ tooltip: true })
.encode(
vl.color().fieldN("Company"),
vl.y()
.fieldN("Company")
.type("nominal")
.sort("-x"),
vl.x()
.average("TransactionVolume")
.title("Total Average Transaction Volume (B)"),
)
.width(350)
.height(HEIGHT);
return vl
.hconcat(plot1, plot2)
.data(weeklyTransactionVolume)
.render();
}
{
const plot = vl
.markPoint({ tooltip: true })
.encode(
vl.y().fieldN("Company").type("nominal"),
vl.x().average("Cap").title("Market Cap / Billion").scale({ zero: false }),
vl.color().fieldN("Company"),
vl.size().fieldQ("Cap").title("Market Cap / Billion").scale({ zero: false}))
.data(marketCap)
.width(350)
.height(200);
return plot.render();
}
dailyTransactionVolume = getTransactionVolume(dailyData, 'M');
weeklyTransactionVolume = getTransactionVolume(weeklyData, 'B');
// To calculate the transaction volume based on given data (daily/weekly) and offset (for scaling)
function getTransactionVolume(mData, offset) {
const N = mData.length;
const MM = 10e6, BB = 10e9;
let div = 1;
if (offset == 'M') div = MM;
else if (offset == 'B') div = BB;
console.log(div);
let res = new Array();
for (let i = 0; i < N; i++) {
if (mData[i] != null) {
res[i] = new Array(mData[i]['Company'], mData[i]['Price'] * mData[i]['Volume'] / div, mData[i]['Date']);
}
}
let resMap = new Array();
for (let i = 0; i < N; i++) {
let a = res[i][0];
let b = res[i][1];
let c = res[i][2];
let map = {};
if (a && b) {
map["Company"] = a;
map["TransactionVolume"] = b;
map["Date"] = c;
}
resMap.push(map);
}
return resMap;
}
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.
