Public
Edited
Jan 10, 2024
Importers
Insert cell
Insert cell
Insert cell
macroPriceData = {
mutable loadingState = true;

const startDate = "2009-01-01T00:00";
const todayEndAPIDate = new Date().toISOString().slice(0, -8);

const cmiAPIUrl = `https://production.api.coindesk.com/v2/tb/price/values/${ASSETS_SYMBOL.cmi}?start_date=${startDate}&end_date=${todayEndAPIDate}&ohlc=false`;

const cmiAPIResponse = await d3.json(replaceCharsForNoCorsServer(cmiAPIUrl));

const cmiData = cmiAPIResponse.data.entries.map(([date, value]) => ({
date: createNewDateObject(date),
price: value
}));

const goldData = (
await d3.csv(
replaceCharsForNoCorsServer(
`https://query1.finance.yahoo.com/v7/finance/download/GC=F?period1=1127987200&period2=${new Date().getTime()}&interval=1d&events=history`
)
)
).map(({ Date, Close }) => ({
date: createNewDateObject(Date),
price: Close
}));

const tltData = (
await d3.csv(
replaceCharsForNoCorsServer(
`https://query1.finance.yahoo.com/v7/finance/download/TLT?period1=1027987200&period2=${new Date().getTime()}&interval=1d&events=history`
)
)
).map(({ Date, Close }) => ({
date: createNewDateObject(Date),
price: Close
}));

const ftseData = (
await d3.csv(
replaceCharsForNoCorsServer(
`https://query1.finance.yahoo.com/v7/finance/download/^FTSE?period1=1230768000&period2=${new Date().getTime()}&interval=1d&events=history`
)
)
).map(({ Date, Close }) => ({
date: createNewDateObject(Date),
price: Close
}));

const sp500Data = (
await d3.csv(
replaceCharsForNoCorsServer(
"https://fred.stlouisfed.org/graph/fredgraph.csv?id=SP500"
)
)
).map(({ DATE, SP500 }) => ({
date: createNewDateObject(DATE),
price: SP500
}));

const nasdaqData = (
await d3.csv(
replaceCharsForNoCorsServer(
"https://fred.stlouisfed.org/graph/fredgraph.csv?id=NASDAQCOM"
)
)
).map(({ DATE, NASDAQCOM }) => ({
date: createNewDateObject(DATE),
price: NASDAQCOM
}));

const nasdaq100Data = (
await d3.csv(
replaceCharsForNoCorsServer(
"https://fred.stlouisfed.org/graph/fredgraph.csv?id=NASDAQ100"
)
)
).map(({ DATE, NASDAQ100 }) => ({
date: createNewDateObject(DATE),
price: NASDAQ100
}));

/* const silverData = (
await d3.csv(
`${CORS_HEAD}https://fred.stlouisfed.org/graph/fredgraph.csv?id=SLVPRUSD`
)
).map((asset) => {
const { DATE, SLVPRUSD } = asset;
return {
date: createNewDateObject(DATE),
price: SLVPRUSD
};
}); */

const nikkeiData = (
await d3.csv(
replaceCharsForNoCorsServer(
"https://fred.stlouisfed.org/graph/fredgraph.csv?id=NIKKEI225"
)
)
).map(({ DATE, NIKKEI225 }) => ({
date: new Date(DATE),
price: NIKKEI225
}));

// const dfxData = (
// await d3.csv(
// replaceCharsForNoCorsServer(
// "https://tradeblock.com/markets/api/v2.0/aslkjas9/index/dfx/csv"
// )
// )
// ).map(({ ts, price }) => ({
// date: createNewDateObject(ts),
// price: parseFloat(price)
// }));

// const dlcxData = (
// await d3.csv(
// replaceCharsForNoCorsServer(
// "https://tradeblock.com/markets/api/v2.0/aslkjas9/index/dlcx/csv"
// )
// )
// ).map(({ ts, price }) => ({
// date: createNewDateObject(ts),
// price: parseFloat(price)
// }));

const today = formatDateForChart(new Date());

const thirtyDaysReturns = {
cmiReturns: getMacroAssetReturn(cmiData, today),
goldReturns: getMacroAssetReturn(goldData, today),
sp500Returns: getMacroAssetReturn(sp500Data, today),
nasdaqReturns: getMacroAssetReturn(nasdaqData, today),
nasdaq100Returns: getMacroAssetReturn(nasdaq100Data, today),
nikkeiReturns: getMacroAssetReturn(nikkeiData, today),
tltReturns: getMacroAssetReturn(tltData, today),
ftseReturns: getMacroAssetReturn(ftseData, today)
// dfxReturns: getMacroAssetReturn(dfxData, today),
// dlcxReturns: getMacroAssetReturn(dlcxData, today)
};

mutable loadingState = false;

return {
prices: {
cmiData,
goldData,
// silverData, NOT AVAILABLE SINCE 2022-09-28
sp500Data,
nasdaqData,
nasdaq100Data,
nikkeiData,
tltData,
ftseData
// dfxData,
// dlcxData
},
thirtyDaysReturns
};
}
Insert cell
Insert cell
Insert cell
getMacroAssetReturns = (endDate, numberOfDays, chartType) => {
const {
prices: {
cmiData,
goldData,
sp500Data,
nasdaqData,
nasdaq100Data,
nikkeiData,
tltData,
ftseData
// dfxData,
// dlcxData
}
} = macroPriceData;

const { cmi, gold, sp500, nasdaq, nasdaq100, nikkei, tlt, ftse } =
ASSETS_SYMBOL;

const cmiReturns = getMacroAssetReturn(
cmiData,
endDate,
numberOfDays,
cmi,
chartType
);
const goldReturns = getMacroAssetReturn(
goldData,
endDate,
numberOfDays,
gold,
chartType
);
const sp500Returns = getMacroAssetReturn(
sp500Data,
endDate,
numberOfDays,
sp500,
chartType
);
const nasdaqReturns = getMacroAssetReturn(
nasdaqData,
endDate,
numberOfDays,
nasdaq,
chartType
);
const nasdaq100Returns = getMacroAssetReturn(
nasdaq100Data,
endDate,
numberOfDays,
nasdaq100,
chartType
);
const nikkeiReturns = getMacroAssetReturn(
nikkeiData,
endDate,
numberOfDays,
nikkei,
chartType
);

const tltReturns = getMacroAssetReturn(
tltData,
endDate,
numberOfDays,
tlt,
chartType
);
const ftseReturns = getMacroAssetReturn(
ftseData,
endDate,
numberOfDays,
ftse,
chartType
);
const dfxReturns = getMacroAssetReturn(
// dfxData,
endDate,
numberOfDays,
// dfx,
chartType
);
const dlcxReturns = getMacroAssetReturn(
// dlcxData,
endDate,
numberOfDays,
// dlcx,
chartType
);

if (chartType === "line") {
const returnsTogether = [
...cmiReturns,
...goldReturns,
...sp500Returns,
...nasdaqReturns,
...nasdaq100Returns,
...nikkeiReturns,
...tltReturns,
...ftseReturns
// ...dfxReturns,
// ...dlcxReturns
];
return Object.values(
returnsTogether.reduce((a, c) => {
a[c.date] = Object.assign(a[c.date] || {}, c);
return a;
}, {})
);
}

if (chartType === "vertical") {
const returnsObjectGenerator = (symbol, returns) => {
if (returns.length === 0) return null;
return {
name: symbol,
value: R.last(returns).percentage.returns,
apiAsset: {
initialClose: returns[0].percentage.quote,
finalClose: R.last(returns).percentage.quote,
symbol: symbol,
symbolDisplay: symbol
}
};
};

return [
returnsObjectGenerator(cmi, cmiReturns),
returnsObjectGenerator(gold, goldReturns),
returnsObjectGenerator(sp500, sp500Returns),
returnsObjectGenerator(nasdaq, nasdaqReturns),
returnsObjectGenerator(nasdaq100, nasdaq100Returns),
returnsObjectGenerator(nikkei, nikkeiReturns),
returnsObjectGenerator(tlt, tltReturns),
returnsObjectGenerator(ftse, ftseReturns)
// returnsObjectGenerator(dfx, dfxReturns),
// returnsObjectGenerator(dlcx, dlcxReturns)
].filter(Boolean);
}

return {
cmiReturns,
goldReturns,
sp500Returns,
nasdaqReturns,
nasdaq100Returns,
nikkeiReturns,
tltReturns,
ftseReturns
};
}
Insert cell
Insert cell
Insert cell
temp_removeNOfDays = (date, numOfDays) => {
const dateOffset = 24 * 60 * 60 * 1000 * numOfDays; //5 days
const myDate = new Date(date);
return myDate.setTime(myDate.getTime() - dateOffset);
}
Insert cell
getMacroAssetReturn = (
macroData,
enddate,
numberOfDays = 30,
assetSymbol,
chartType,
method = "classic"
) => {
// const startDate = removeNumberOfDaysFromDateToTime(enddate, numberOfDays);
const startDate = temp_removeNOfDays(enddate, numberOfDays);

if (!Array.isArray(macroData)) {
// Handle the case where macroData is not an array
return [];
}

const data = macroData.filter((d) => d.price !== ".");
const filter = data.filter(({ date }) => {
return (
dateToTime(date) >= startDate && dateToTime(date) <= dateToTime(enddate)
);
});

const returns = filter.map((currentValue, index, array) => {
const propName = chartType === "line" ? assetSymbol : "percentage";
const currentDate =
chartType === "line" ? new Date(array[index].date) : array[index].date;
const date = formatDateForChart(currentDate);

if (index === 0) {
return {
date,
[propName]: { returns: 0, quote: array[0].price }
};
}
if (method === "classic") {
return {
date,
[propName]: {
returns: (array[index].price - array[0].price) / array[0].price,
quote: array[index].price
}
};
}
if (method === "log") {
return {
date: array[index].date,
[propName]: {
returns: Math.log(array[index].price / array[0].price),
quote: array[index].price
}
};
}
});

return returns;
}
Insert cell
mutable loadingState = false
Insert cell
loadingStateFunction = (whatToShowWhenFinished = md`----`) =>
loadingState ? html`${spinnerDIV()}` : whatToShowWhenFinished
Insert cell
Insert cell
R = require("ramda")
Insert cell
import {
replaceCharsForNoCorsServer,
MACRO_PARSER,
pageCSS,
formElementsCSS,
spinnerSTYLE,
spinnerDIV,
createNewDateObject,
CHECKBOX_OPTIONS,
removeNumberOfDaysFromDateToTime,
removeNumberOfDaysFromDateNoFormat,
formatDateForChart,
dateToTime
} from "@coindesk-research/cd-static-content-provider"
Insert cell
pageCSS
Insert cell
formElementsCSS
Insert cell
spinnerSTYLE
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.
Learn more