2c:null 2d:["$","title",null,{"children":"Bollinger Bands | Steve Pegg | Observable"}] 32:[] 30:{"id":"e958b104fae607e5","slug":"bollinger-bands","title":"Bollinger Bands","thumbnail":"3b375c462c252a00fbe3f5ca346031a5eacb501cf7b3c802a37b23475e1b01ec","access_level":"public","create_time":"$D2021-02-09T17:04:37.963Z","update_time":"$D2021-02-15T22:06:58.700Z","view_time":null,"first_public_time":"$D2021-02-10T14:15:44.507Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"ea29cfe69c48ffa5","login":"steve-pegg","name":"Steve Pegg","avatar_url":"https://avatars-next.observableusercontent.com/91fcbf278fe93654a1747f10b741f5a8784201a827ba9ee211f90deccfffe490","tier":"starter_2024","bio":"Mainly coding for fun these days!"},"version":457,"publish_version":457,"role":null,"authored":false,"authors":[{"type":"individual","id":"1281bb8ce5440734","login":"steve-pegg","name":"Steve Pegg","avatar_url":"https://avatars-next.observableusercontent.com/91fcbf278fe93654a1747f10b741f5a8784201a827ba9ee211f90deccfffe490","tier":null,"bio":"Mainly coding for fun these days!"}],"members":[{"type":"individual","id":"1281bb8ce5440734","login":"steve-pegg","name":"Steve Pegg","avatar_url":"https://avatars-next.observableusercontent.com/91fcbf278fe93654a1747f10b741f5a8784201a827ba9ee211f90deccfffe490","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Bollinger Bands","cells":[{"id":1,"value":"md`# Bollinger Bands\n\nThis time series [line chart](/@d3/line-chart) includes [Bollinger bands](https://en.wikipedia.org/wiki/Bollinger_Bands): simple, lagging [moving averages](https://en.wikipedia.org/wiki/Moving_average) for characterizing volatility. Data: Google Finance`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":174,"value":"viewof N = {\n const form = html``;\n form.i.oninput = () => form.value = form.i.valueAsNumber;\n form.i.oninput();\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":176,"value":"viewof K = {\n const form = html``;\n form.i.oninput = () => form.value = form.i.valueAsNumber;\n form.i.oninput();\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":305,"value":"viewof order = select([\"VWS\", \"ORSTED\", \"LON:RB\", \"ASML\", \"FSLR\",\"LON:CCL\",\"LON:CWK\",\"ETR:IFX\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"chart = {\n \n let parent = this; \n parent = document.createElement(\"div\");\n \n const svg = d3.select(DOM.svg(width, height))\n .style(\"overflow\", \"visible\");\n\n svg.append(\"g\")\n .call(xAxis);\n\n svg.append(\"g\")\n .call(yAxis);\n\n svg.append(\"g\")\n .attr(\"fill\", \"none\")\n .attr(\"stroke-width\", 1.5)\n .attr(\"stroke-linejoin\", \"round\")\n .attr(\"stroke-linecap\", \"round\")\n .selectAll(\"path\")\n .data(final)\n // .data([values, ...bollinger(values, N, [-K, 0, +K])])\n .join(\"path\")\n .attr(\"stroke\", (d, i) => [\"#aaa\", \"green\", \"blue\", \"red\"][i])\n .attr(\"d\", line);\n\n parent.appendChild(svg.node());\n // parent.appendChild(tooltip.node());\n \n return Object.assign(parent, {\n update(order) {\n \n }\n }) \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":180,"value":"function bollinger(values, N, K) {\n let i = 0;\n let sum = 0;\n let sum2 = 0;\n const bands = K.map(() => new Float64Array(values.length).fill(NaN));\n for (let n = Math.min(N - 1, values.length); i < n; ++i) {\n const value = values[i];\n sum += value, sum2 += value ** 2;\n }\n for (let n = values.length, m = bands.length; i < n; ++i) {\n const value = values[i];\n sum += value, sum2 += value ** 2;\n const mean = sum / N;\n const deviation = Math.sqrt((sum2 - sum ** 2 / N) / (N - 1));\n for (let j = 0; j < K.length; ++j) {\n bands[j][i] = mean + deviation * K[j];\n }\n const value0 = values[i - N + 1];\n sum -= value0, sum2 -= value0 ** 2;\n }\n return bands;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"height = 600","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":48,"value":"margin = ({top: 10, right: 20, bottom: 30, left: 40})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"x = d3.scaleTime()\n .domain(d3.extent(data, d => d.date))\n .rangeRound([margin.left, width - margin.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"y = d3.scaleLog()\n .domain(d3.extent(values))\n .rangeRound([height - margin.bottom - 20, margin.top])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":70,"value":"xAxis = g => g\n .attr(\"transform\", `translate(0,${height - margin.bottom})`)\n .call(d3.axisBottom(x).ticks(width / 80))\n .call(g => g.select(\".domain\").remove())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":74,"value":"yAxis = g => g\n .attr(\"transform\", `translate(${margin.left},0)`)\n .call(d3.axisLeft(y).tickValues(d3.ticks(...y.domain(), 10)).tickFormat(d => d))\n .call(g => g.select(\".domain\").remove())\n .call(g => g.selectAll(\".tick line\").clone()\n .attr(\"x2\", width - margin.left - margin.right)\n .attr(\"stroke-opacity\", 0.1))\n .call(g => g.select(\".tick:last-of-type text\").clone()\n .attr(\"x\", 3)\n .attr(\"text-anchor\", \"start\")\n .attr(\"font-weight\", \"bold\")\n .text(data.y))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":65,"value":"line = d3.line()\n .defined(d => !isNaN(d))\n .x((d, i) => x(data[i].date))\n .y(y)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":411,"value":"final = [values,...bollinger(values, N, [-K, 0, +K])]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":258,"value":"values = Float64Array.from(data.filter(d => d.name === order), d => d.value)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":378,"value":"filter = [...filt]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":373,"value":"filt = [...new Set(data.map(d => d.name))]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":289,"value":"data = { \n var arr = []\n const data = await d3.tsv(url);\n const columns = data.columns.slice(3);\n var x = 0\n \n data.forEach(function (d) { \n \n for (x = 0; x < columns.length; x++) {\n arr.push({\"name\": d.name, \"stock\": d.stock, \"date\": parseDate(columns[x]), \"value\": +d[columns[x]]}) \n } \n \n })\n \n return arr\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":290,"value":"parseDate = d3.timeParse(\"%d/%m/%Y\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":287,"value":"google_sheet_url = \"https://docs.google.com/spreadsheets/d/e/2PACX-1vQo2mhhsUlEf71Nu6lqFYF1fAKRkdgiqTupfU7H_7YpT3XnQ3ELr_hEhpd5BB3O574nH11rJvoG9N-n/pub?output=tsv\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":285,"value":"url = `https://sjp7001.herokuapp.com/${google_sheet_url}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":421,"value":"import {select} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":307,"value":"import {autoSelect} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"d3 = require(\"d3@6\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1"}} 31:"$30:body"