25:["$","title",null,{"children":"Dollar cost averaging the SP500 | Nick Ecoinometrics | Observable"}] 49:Tdfc,addTooltips = (chart, hover_styles = { stroke: "red", "stroke-width": 3 }) => { let styles = hover_styles; const line_styles = { stroke: "blue", "stroke-width": 3 }; // Workaround if it's in a figure const type = d3.select(chart).node().tagName; let wrapper = type === "FIGURE" ? d3.select(chart).select("svg") : d3.select(chart); // Workaround if there's a legend.... const numSvgs = d3.select(chart).selectAll("svg").size(); if (numSvgs === 2) wrapper = d3 .select(chart) .selectAll("svg") .filter((d, i) => i === 1); wrapper.style("overflow", "visible"); // to avoid clipping at the edges // Set pointer events to visibleStroke if the fill is none (e.g., if its a line) wrapper.selectAll("path").each(function (data, index, nodes) { // For line charts, set the pointer events to be visible stroke if ( d3.select(this).attr("fill") === null || d3.select(this).attr("fill") === "none" ) { d3.select(this).style("pointer-events", "visibleStroke"); styles = _.isEqual(hover_styles, { fill: "blue", opacity: 0.5 }) ? line_styles : hover_styles; } }); const tip = wrapper .selectAll(".hover-tip") .data([""]) .join("g") .attr("class", "hover") .style("pointer-events", "none") .style("text-anchor", "middle"); // Add a unique id to the chart for styling const id = id_generator(); // Add the event listeners d3.select(chart) .classed(id, true) // using a class selector so that it doesn't overwrite the ID .selectAll("title") .each(function () { // Get the text out of the title, set it as an attribute on the parent, and remove it const title = d3.select(this); // title element that we want to remove const parent = d3.select(this.parentNode); // visual mark on the screen const t = title.text(); if (t) { parent.attr("__title", t).classed("has-title", true); title.remove(); } // Mouse events parent .on("mousemove", function (event) { const text = d3.select(this).attr("__title"); const pointer = d3.pointer(event, wrapper.node()); if (text) tip.call(hover, pointer, text.split("\n")); else tip.selectAll("*").remove(); // Raise it d3.select(this).raise(); // Keep within the parent horizontally const tipSize = tip.node().getBBox(); if (pointer[0] + tipSize.x < 0) tip.attr( "transform", `translate(${tipSize.width / 2}, ${pointer[1] + 7})` ); else if (pointer[0] + tipSize.width / 2 > wrapper.attr("width")) tip.attr( "transform", `translate(${wrapper.attr("width") - tipSize.width / 2}, ${ pointer[1] + 7 })` ); }) .on("mouseout", function (event) { tip.selectAll("*").remove(); // Lower it! d3.select(this).lower(); }); }); // Remove the tip if you tap on the wrapper (for mobile) wrapper.on("touchstart", () => tip.selectAll("*").remove()); // Add styles const style_string = Object.keys(styles) .map((d) => { return `${d}:${styles[d]};`; }) .join(""); // Define the styles const style = html``; chart.appendChild(style); return chart; }4a:T5bd,brushFilterX = function ( extent, { defaultExtent, marginTop = 10, marginRight = 20, marginBottom = 20, marginLeft = 65, width = document.body.clientWidth, height = 50 } = {} ) { const x = d3 .scaleTime() .domain(extent) .range([marginLeft, width - marginRight]); const xAxis = (g) => g .attr("transform", `translate(0,${height - marginBottom + 1})`) .call(d3.axisBottom(x).ticks(width < 710 ? 6 : 10)); const svg = d3 .create("svg") .attr("width", "100%") .attr("height", height) .attr("viewBox", [0, 0, width, height]); svg .selectAll("text") .data(["brush to", "filter"]) .join("text") .text((d) => d) .style("font-size", 10) .style("font-family", "sans-serif") .attr("dx", 10) .attr("dy", (d, i) => marginTop + 10 + i * 10); const brush = d3 .brushX() .extent([ [marginLeft, marginTop], [width - marginRight, height - marginBottom] ]) .on("brush end", brushed); svg.append("g").call(xAxis); let b = svg.append("g").call(brush); if (defaultExtent) b.call(brush.move, defaultExtent.map(x)); function brushed(event) { svg.node().value = event.selection === null ? null : event.selection.map(x.invert); svg.node().dispatchEvent(new Event("input", { bubbles: true })); const selection = event.selection; } svg.node().value = defaultExtent ? defaultExtent : null; return svg.node(); }4b:[{"id":"2caae347df068a616d81e6c62b2ada00d91553bae9ffb890bfd96c0aca5f92e4ea7cc58af4731a8c36d33b45c6d675dcb6ae7a938d6697073ab52fc9b98b8760","href":"https://static.observableusercontent.com/files/2caae347df068a616d81e6c62b2ada00d91553bae9ffb890bfd96c0aca5f92e4ea7cc58af4731a8c36d33b45c6d675dcb6ae7a938d6697073ab52fc9b98b8760","name":"SP500.csv","type":"text/csv","lastModified":1667840090788.858,"size":1673404},{"id":"9e24b658114c667b384914c1bf3b9e7a1c14013ef738c266bbbf7ddfaf2b604cbc775ff76e63e7d1680fc333f1f3737da97b502af848aac15f4ff8cb214e04cc","href":"https://static.observableusercontent.com/files/9e24b658114c667b384914c1bf3b9e7a1c14013ef738c266bbbf7ddfaf2b604cbc775ff76e63e7d1680fc333f1f3737da97b502af848aac15f4ff8cb214e04cc","name":"SP500_ANNUALIZED_RETURNS.csv","type":"text/csv","lastModified":1668325982891.071,"size":50606}] 29:{"id":"e07aa028c8b06844","slug":null,"title":"Dollar cost averaging the SP500","thumbnail":"61e8b6d304a1f159da10e4860d4f5cec3976d1aea1aaa4beea36b4e8fe999fa8","access_level":"public","create_time":"$D2022-11-07T16:24:27.938Z","update_time":"$D2022-12-20T06:51:33.177Z","view_time":null,"first_public_time":"$D2022-11-25T04:08:37.209Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"a0843bf11105a12f","login":"eb53d064e7a1280a","name":"Nick Ecoinometrics","avatar_url":"https://avatars-next.observableusercontent.com/97956e49f2807dc25091fd1d6cf04d646385341e80a42f7d2389eab1538571b6","tier":"starter_2024","bio":"","following":false},"version":553,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"eb53d064e7a1280a","login":"eb53d064e7a1280a","name":"Nick Ecoinometrics","avatar_url":"https://avatars-next.observableusercontent.com/97956e49f2807dc25091fd1d6cf04d646385341e80a42f7d2389eab1538571b6","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"eb53d064e7a1280a","login":"eb53d064e7a1280a","name":"Nick Ecoinometrics","avatar_url":"https://avatars-next.observableusercontent.com/97956e49f2807dc25091fd1d6cf04d646385341e80a42f7d2389eab1538571b6","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Dollar cost averaging the SP500","cells":[{"id":0,"value":"# Dollar cost averaging the SP500","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"## Import","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":7,"value":"//import {addTooltips} from \"@mkfreeman/plot-tooltip\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"import {swatches} from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"//import {brushFilterX} from \"@observablehq/brush-filter-x\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"import {date} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"import {rangeSlider} from \"@mootari/range-slider\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":509,"value":"import { disposal } from \"@mbostock/disposal\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":512,"value":"import { View } from \"@mbostock/synchronized-views\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"## Load data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":24,"value":"sp500_data = FileAttachment(\"SP500.csv\").csv({typed: true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"viewof sp500_data_table = Inputs.table(sp500_data, {})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":248,"value":"sp500_annualized_returns_data = FileAttachment(\n \"SP500_ANNUALIZED_RETURNS.csv\"\n).csv({ typed: true })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":251,"value":"viewof sp500_annualized_returns_table = Inputs.table(\n sp500_annualized_returns_data,\n {}\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"## Historical DCA calculator","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":41,"value":"Over what period do you consider to DCA.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":32,"value":"viewof dcaHistoricalDateFilterX = brushFilterX(\n d3.extent(sp500_data, (d) => d.DATE),\n {\n defaultExtent: [\n d3.isoParse(\"2010-01-01\"),\n d3.extent(sp500_data, (d) => d.DATE)[1]\n ],\n width: 800\n }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":35,"value":"sp500_filtered_data = sp500_data.filter(function(d) {\n return d.DATE >= dcaHistoricalDateFilterX[0] && d.DATE <= dcaHistoricalDateFilterX[1];\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":39,"value":"viewof sp500_filtered_data_table = Inputs.table(sp500_filtered_data, {})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":43,"value":"How much do you plan to DCA on a weekly basis?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":45,"value":"viewof _weeklyDcaValue = Inputs.number([50, 50000], {\n step: 50,\n value: 150,\n label: \"Weekly DCA amount in US$\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":454,"value":"viewof weeklyDcaValue = new View(150) //html``","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":462,"value":"//weeklyDcaValue = +weeklyDcaValue_.value","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":75,"value":"compute_dca = function (sp500_source, dca_amount) {\n var sp500_dca_data = sp500_source;\n for (let i = 0; i < sp500_dca_data.length; i++) {\n if (d3.timeFormat(\"%A\")(sp500_dca_data[i].DATE) == \"Monday\") {\n if (i == 0) {\n sp500_dca_data[i].SHARES = dca_amount / sp500_dca_data[i].CLOSE;\n } else {\n sp500_dca_data[i].SHARES =\n dca_amount / sp500_dca_data[i].CLOSE + sp500_dca_data[i - 1].SHARES;\n }\n } else {\n if (i == 0) {\n sp500_dca_data[i].SHARES = 0;\n } else {\n sp500_dca_data[i].SHARES = sp500_dca_data[i - 1].SHARES;\n }\n }\n sp500_dca_data[i].WEEKDAY = d3.timeFormat(\"%A\")(sp500_dca_data[i].DATE);\n sp500_dca_data[i].DCA_VALUE =\n sp500_dca_data[i].SHARES * sp500_dca_data[i].CLOSE;\n }\n\n return sp500_dca_data;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":95,"value":"computed_dca = compute_dca(sp500_filtered_data, weeklyDcaValue)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":99,"value":"viewof x_table = Inputs.table(computed_dca, {})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":103,"value":"compute_dca_summary = function (sp500_dca_data, weeklyDcaValue, extentOfDca) {\n var dca_summary = {};\n dca_summary.WEEKLY_DCA_AMOUNT = weeklyDcaValue;\n dca_summary.START = dcaHistoricalDateFilterX[0]\n dca_summary.END = dcaHistoricalDateFilterX[1]\n dca_summary.DURATION = d3.timeDays(\n dcaHistoricalDateFilterX[0],\n dcaHistoricalDateFilterX[1]\n ).length;\n dca_summary.VALUE = sp500_dca_data[sp500_dca_data.length - 1].DCA_VALUE;\n return dca_summary;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":107,"value":"dca_summary = compute_dca_summary(\n computed_dca,\n weeklyDcaValue,\n dcaHistoricalDateFilterX\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":111,"value":"dca_summary_text = html`Your position is worth ${d3.format(\n \"$,.0f\"\n)(\n dca_summary.VALUE\n)} after dollar cost averaging the SP500 to the tune of ${d3.format(\n \"$,.0f\"\n)(dca_summary.WEEKLY_DCA_AMOUNT)} weekly between ${d3.timeFormat(\n \"%Y-%m-%d\"\n)(dca_summary.START)} and ${d3.timeFormat(\"%Y-%m-%d\")(dca_summary.END)}.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":136,"value":"dca_historical_value_chart = addTooltips(\n Plot.plot({\n width,\n height: 600,\n marginLeft: 100,\n style: {\n background: \"#F2DFCE\"\n },\n y: {\n grid: true,\n label: \"↑ Value of the position\",\n tickFormat: \"$,.0f\"\n },\n marks: [\n Plot.areaY(computed_dca, {\n x: \"DATE\",\n y: \"DCA_VALUE\",\n fill: \"#FF0000\",\n fillOpacity: 0.5\n }),\n Plot.lineY(computed_dca, {\n x: \"DATE\",\n y: \"DCA_VALUE\",\n stroke: \"#FF0000\",\n title: (d) =>\n `Value of the position ${d3.format(\"$,.0f\")(\n d.DCA_VALUE\n )}\\non ${d3.timeFormat(\"%Y-%m-%d\")(d.DATE)}`\n }),\n Plot.ruleY([0])\n ]\n })\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":177,"value":"## Historical DCA calculator (assembled widget)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":436,"value":"historical_dca_calculator = htl.html`\n

Pick your weekly buying amount $${bind(\n html``,\n viewof weeklyDcaValue\n)} and to choose the period you want to cover simply pick the date interval on the brush below.

${viewof dcaHistoricalDateFilterX}

${dca_summary_text}

${dca_historical_value_chart}

\n\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":246,"value":"## How long to get to $1 million with DCA?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":526,"value":"viewof expectedDcaValue = new View(150)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":534,"value":"viewof expectedAnnualizedReturn = new View(5)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":309,"value":"viewof _expectedDcaValue = Inputs.number([50, 50000], {\n step: 50,\n value: 150,\n label: \"Weekly DCA amount in US$\"\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":478,"value":"expectedDcaValue_ = html``","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":481,"value":"//expectedDcaValue = +expectedDcaValue_.value","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":288,"value":"median_annualized_return = d3.median(\n sp500_annualized_returns_data,\n (d) => d.ANNUALIZED_RETURN\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":298,"value":"viewof _expectedAnnualizedReturn = Inputs.number([0.01, 0.3], {\n step: 0.001,\n value: 0.05,\n label: \"Expected annualized return\"\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":483,"value":"expectedAnnualizedReturn_ = html``","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":485,"value":"//expectedAnnualizedReturn = +expectedAnnualizedReturn_.value / 100","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":255,"value":"distribution_of_annualized_returns_plot = addTooltips(\n Plot.plot({\n height: 400,\n width: width,\n style: {\n background: \"#F2DFCE\"\n },\n x: {\n grid: true,\n label: \"Annualized returns\",\n tickFormat: \"%\",\n axis: \"top\",\n labelAnchor: \"center\",\n nice: true\n },\n marks: [\n Plot.dot(\n sp500_annualized_returns_data,\n Plot.dodgeY({\n x: \"ANNUALIZED_RETURN\",\n anchor: \"middle\",\n fill: \"#2C5AA0\"\n })\n ),\n Plot.ruleX([median_annualized_return], {\n stroke: \"#FF6600\",\n strokeWidth: 2\n }),\n Plot.ruleX([expectedAnnualizedReturn / 100], {\n stroke: \"#FF0000\",\n strokeWidth: 2\n })\n ]\n })\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":302,"value":"dca_to_a_million = function (annualized_return, weekly_dca_amount) {\n var weekly_return = (1 + annualized_return) ** (7 / 365) - 1;\n var position_value = 0;\n var week_count = 0;\n var new_date = new Date();\n var to_a_million = [{ week: week_count, value: position_value }];\n while (position_value < 1e6) {\n let newDate = new_date.setDate(new_date.getDate() + 7);\n new_date = new Date(newDate);\n week_count += 1;\n position_value = (1 + weekly_return) * position_value + weekly_dca_amount;\n to_a_million.push({\n date: new_date,\n week: week_count,\n value: position_value\n });\n }\n return to_a_million;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":305,"value":"to_a_million = dca_to_a_million(\n expectedAnnualizedReturn / 100,\n expectedDcaValue\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":312,"value":"summary_to_a_million = function (to_a_million) {\n var max_week = to_a_million[to_a_million.length - 1].week;\n var summary = {\n years: Math.floor(max_week / 52),\n months: Math.floor((max_week % 52) / 4),\n weeks: (max_week % 52) % 4\n };\n return summary;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":314,"value":"to_a_million_summary = summary_to_a_million(to_a_million)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":354,"value":"dca_expected_summary_text = html`If you assume future annualized returns of ${d3.format(\n \",.1%\"\n)(\n expectedAnnualizedReturn / 100\n)} will take you ${\n to_a_million_summary.years\n} years ${to_a_million_summary.months} months and ${\n to_a_million_summary.weeks\n} weeks to make $1 million by dollar cost averaging the SP500 to the tune of ${d3.format(\n \"$,.0f\"\n)(expectedDcaValue)} every week.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":317,"value":"dca_expected_value_chart = addTooltips(\n Plot.plot({\n width,\n height: 600,\n marginLeft: 100,\n style: {\n background: \"#F2DFCE\"\n },\n y: {\n grid: true,\n label: \"↑ Value of the position\",\n tickFormat: \"$,.0f\",\n nice: true,\n domain: [0, d3.max(to_a_million, (d) => d.value)]\n },\n marks: [\n Plot.areaY(to_a_million, {\n x: \"date\",\n y: \"value\",\n fill: \"#FF0000\",\n fillOpacity: 0.5\n }),\n Plot.lineY(to_a_million, {\n x: \"date\",\n y: \"value\",\n stroke: \"#FF0000\",\n title: (d) =>\n `Value of the position ${d3.format(\"$,.0f\")(\n d.value\n )}\\non ${d3.timeFormat(\"%Y-%m-%d\")(d.date)}`\n }),\n Plot.ruleY([0])\n ]\n })\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":367,"value":"median_to_a_million = dca_to_a_million(\n median_annualized_return,\n expectedDcaValue\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":370,"value":"median_to_a_million_summary = summary_to_a_million(median_to_a_million)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":372,"value":"dca_median_summary_text = html`Over the past 100 years the median annualized return of the SP500 is ${d3.format(\n \",.1%\"\n)(\n median_annualized_return\n)}. With this rate of returns it will take you ${\n median_to_a_million_summary.years\n} years ${median_to_a_million_summary.months} months and ${\n median_to_a_million_summary.weeks\n} weeks to make $1 million by dollar cost averaging to the tune of ${d3.format(\n \"$,.0f\"\n)(expectedDcaValue)} every week.`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":375,"value":"## How long to get to $1 million with DCA? (Assembled widget)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":529,"value":"pick_expected_dca_amount = htl.html`\n

Pick your weekly buying amount for the years to come: $${bind(\n html``,\n viewof expectedDcaValue\n)}.

${distribution_of_annualized_returns_plot}

Choose your expected annualized returns for the years to come and see where it falls in the historical distribution: ${bind(\n html``,\n viewof expectedAnnualizedReturn\n)}%.

${dca_expected_summary_text}

\n
\n

${dca_expected_value_chart}

`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":155,"value":"## Helpers","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":159,"value":"$49","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":161,"value":"// Function to position the tooltip\nhover = (tip, pos, text) => {\n const side_padding = 10;\n const vertical_padding = 5;\n const vertical_offset = 15;\n\n // Empty it out\n tip.selectAll(\"*\").remove();\n\n // Append the text\n tip\n .style(\"text-anchor\", \"start\")\n .style(\"pointer-events\", \"none\")\n .attr(\"transform\", `translate(${pos[0]}, ${pos[1] + 7})`)\n .selectAll(\"text\")\n .data(text)\n .join(\"text\")\n .style(\"dominant-baseline\", \"ideographic\")\n .text((d) => d)\n .attr(\"y\", (d, i) => (i - (text.length - 1)) * 15 - vertical_offset)\n .style(\"font-weight\", (d, i) => (i === 0 ? \"bold\" : \"normal\"));\n\n const bbox = tip.node().getBBox();\n\n // Add a rectangle (as background)\n tip\n .append(\"rect\")\n .attr(\"y\", bbox.y - vertical_padding)\n .attr(\"x\", bbox.x - side_padding)\n .attr(\"width\", bbox.width + side_padding * 2)\n .attr(\"height\", bbox.height + vertical_padding * 2)\n .style(\"fill\", \"#F2DFCEFF\")\n .style(\"stroke\", \"#d3d3d3\")\n .lower();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":163,"value":"// To generate a unique ID for each chart so that they styles only apply to that chart\nid_generator = () => {\n var S4 = function () {\n return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);\n };\n return \"a\" + S4() + S4();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":407,"value":"$4a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":506,"value":"bind = function bind(input, view) {\n const value = [\"range\", \"number\"].includes(input.type)\n ? \"valueAsNumber\"\n : \"value\";\n var update;\n if (input.type == \"file\") {\n update = () => {};\n input.oninput = () => {\n view.value = input.files;\n };\n } else if (input.type == \"radiogroup\") {\n update = () => {\n input.setter(view.value);\n };\n input.oninput = () => {\n view.value = input.getter();\n };\n } else if (input.type == \"checkbox\") {\n update = () => (input.checked = view.value);\n input.oninput = () => (view.value = input.checked);\n } else {\n update = () => (input[value] = view.value);\n input.oninput = () => (view.value = input[value]);\n }\n view.addEventListener(\"input\", update);\n disposal(input).then(() => view.removeEventListener(\"input\", update));\n return update(), input;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":226,"value":"## Style","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":228,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"}],"files":"$W4b","stdlib":"1"}} 24:null