30:[] 2e:{"title":"Payoff Chart","cells":[{"id":0,"value":"md`# Payoff Chart`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1901,"value":"html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":355,"value":"md`** SETUP ** :\nA stock of IBM is trading at $150`","pinned":false,"hidden":false,"mode":"ojs"},{"id":917,"value":"md`## 1. STOCK Position`","pinned":false,"hidden":false,"mode":"ojs"},{"id":931,"value":"viewof StockPosition = {\n let max = d3.max(\n [-(strike - minStrike) * 100, (maxStrike - strike) * 100].map(Math.abs)\n );\n let yScale = y(-max, max),\n viewBox = [-m + 5, -h - 5, w + 2 * m, h * 2].join(' ');\n let view = html`\n`;\n\n view.value = d3\n .select(view)\n .append('g')\n .attr('class', 'main-group');\n\n let g = d3.select(view).append('g');\n view.value = g;\n\n yield view;\n\n let groups = createMainGroups(g);\n xAxis(groups, strikeScale);\n yAxis(groups, yScale);\n\n // d3.select(view).call(xAxis);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":751,"value":"ShortStock = positionScale => `\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":789,"value":"LongStock = positionScale => ``","pinned":false,"hidden":false,"mode":"ojs"},{"id":937,"value":"md`---\n## Option Position`","pinned":false,"hidden":false,"mode":"ojs"},{"id":182,"value":"IBM_AllOptions = d3.merge(\n IBM_Options.map(x => {\n let it = x.optionChain.result;\n\n return [...it[0].options[0].calls, ...it[0].options[0].puts];\n })\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":295,"value":"Top3 = IBM_AllOptions.filter(x => x.volume > 1000)","pinned":false,"hidden":false,"mode":"ojs"},{"id":325,"value":"strikes = [...new Set(IBM_AllOptions.map(x => x.strike))].sort(d3.ascending)","pinned":false,"hidden":false,"mode":"ojs"},{"id":205,"value":"maxStrike = d3.max(strikes)","pinned":false,"hidden":false,"mode":"ojs"},{"id":219,"value":"minStrike = d3.min(strikes)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2,"value":"md`\\`profit 'n' loss \\` / payoff-chart \n\n\n<--------------\\`xScale:scalePoint\\-->\\`strike prices ------------------>\n\n ^\n |\n |positives:profit\n |\n \\`yScale:scaleLinear\\` \n |\n |negative:loss\n |\n v\n\n\n\n\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1106,"value":"md`---\n### SINGLE LEG`","pinned":false,"hidden":false,"mode":"ojs"},{"id":522,"value":"strike = 150","pinned":false,"hidden":false,"mode":"ojs"},{"id":280,"value":"price = 15","pinned":false,"hidden":false,"mode":"ojs"},{"id":535,"value":"ShortCall = positionScale => `\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":549,"value":"LongCall = positionScale =>\n `\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1636,"value":"// yScale(-maxPosition, maxPosition)","pinned":true,"hidden":false,"mode":"ojs"},{"id":356,"value":"viewof CHART = {\n let yScale = y(-maxPosition, maxPosition),\n option_viewBox = [-m, -h - 5, w + 2 * m, h * 2].join(' ');\n let view = html`\n\n${LongCall(yScale)}\n${ShortCall(yScale)}\n`;\n\n let g = d3.select(view).append('g');\n view.value = g;\n\n yield view;\n\n let groups = createMainGroups(g);\n xAxis(groups, strikeScale);\n yAxis(groups, yScale);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1338,"value":"md`--- \n### Chart Groups`","pinned":false,"hidden":false,"mode":"ojs"},{"id":373,"value":"createMainGroups = g =>\n g\n .selectAll('.main-group')\n .data(['x', 'y', 'option'])\n .join('g')\n .attr('class', d => d + ' main-group')","pinned":false,"hidden":false,"mode":"ojs"},{"id":1964,"value":"mutable temp2 = null","pinned":true,"hidden":false,"mode":"ojs"},{"id":1970,"value":"d3\n .select(temp2)\n .node()\n .getBoundingClientRect().y","pinned":true,"hidden":false,"mode":"ojs"},{"id":1945,"value":"temp.each(function(g) {\n mutable temp2 = this;\n // let node = this.parentNode.insertBefore(this.cloneNode(true), true);\n // cloneNode.push(node);\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":1951,"value":"mutable cloneNode = []","pinned":true,"hidden":false,"mode":"ojs"},{"id":1954,"value":"cloneNode.map(x =>\n d3\n .select(x)\n .attr('x', width / 2)\n .attr('y', h)\n)","pinned":true,"hidden":false,"mode":"ojs"},{"id":1940,"value":"mutable temp = null","pinned":true,"hidden":false,"mode":"ojs"},{"id":380,"value":"xAxis = (sel, scale) =>\n sel\n .filter(d => d === 'x')\n .selectAll('.x-axis')\n .data(['x-axis'])\n .join('g')\n .attr('class', d => d)\n .attr('transform', `translate(${0},${h})`)\n .call(\n d3\n .axisTop()\n .scale(scale)\n .ticks(strike / 10)\n .tickSize(h * 2)\n // .tickPadding(-h - 4)\n )\n .call(g => {\n let text = g\n .selectAll('text')\n .attr('font-size', 12)\n .attr('dominant-baseline', 'baseline')\n .attr('fill', 'silver');\n mutable temp = text;\n g.selectAll('line').attr('opacity', 0.1);\n // mutable temp = text;\n })","pinned":true,"hidden":false,"mode":"ojs"},{"id":343,"value":"yAxis = (sel, scale) =>\n sel\n .filter(d => d === 'y')\n .selectAll('.y-axis')\n .data(['y-axis'])\n .join('g')\n .attr('class', d => d)\n .attr('transform', `translate(${m},${0})`)\n\n .call(\n d3\n .axisRight()\n .scale(scale)\n .tickSize(w - m * 2)\n .tickPadding(-w + m)\n .tickFormat(d3.format(',.0f'))\n )\n .call(g => {\n g.selectAll('line')\n .attr('stroke-dasharray', [2, 1])\n .attr('opacity', 0.5);\n\n g.selectAll('text')\n .attr('text-anchor', 'middle')\n .attr('font-size', 12);\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":864,"value":"md`---\n### SCALES`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1396,"value":"value = price * 100","pinned":true,"hidden":false,"mode":"ojs"},{"id":1408,"value":"maxPosition = (maxStrike - strike) * 100 - price","pinned":true,"hidden":false,"mode":"ojs"},{"id":719,"value":"y = (min, max) =>\n d3\n .scaleLinear()\n .domain([min, max])\n .range([h, -h])\n .clamp(true)","pinned":false,"hidden":false,"mode":"ojs"},{"id":714,"value":"strikeScale = d3\n .scaleLinear()\n .domain(d3.extent(strikes))\n .range([m, w - m])","pinned":false,"hidden":false,"mode":"ojs"},{"id":867,"value":"md`---\n## MULTI-LEG POSITION\n\n**SETUP:** YHOO is trading at $40\n\n\n I still haven't figured out how to tackle this. Therefore, this section is INCOMPLETE.\n \n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":255,"value":"MultiLeg_Position = {\n let position = YHOO_Position;\n return position;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1764,"value":"md`---\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1853,"value":"md`## DATA`","pinned":false,"hidden":false,"mode":"ojs"},{"id":153,"value":"IBM_Options = OptionChainFetcher('IBM')","pinned":true,"hidden":false,"mode":"ojs"},{"id":1872,"value":"YHOO_Position = {\n let CONTRACTS = [\"JAN46\", \"JAN48\", \"JAN50\", \"JAN55\", \"OCT42\", \"OCT44\"],\n QTY = [50, 50, 100, -200, 50, -50];\n return d3.range(CONTRACTS.length).map(x => {\n let it = {};\n it.qty = QTY[x];\n it.contract = CONTRACTS[x];\n return it;\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":28,"value":"h = 200","pinned":false,"hidden":false,"mode":"ojs"},{"id":44,"value":"w=width;","pinned":false,"hidden":false,"mode":"ojs"},{"id":48,"value":"m = 25","pinned":false,"hidden":false,"mode":"ojs"},{"id":1848,"value":"md`## ANX`","pinned":false,"hidden":false,"mode":"ojs"},{"id":149,"value":"import { OptionChainFetcher } from '@stroked/yahoofinance'","pinned":true,"hidden":false,"mode":"ojs"},{"id":193,"value":"d3 = require('d3')","pinned":true,"hidden":false,"mode":"ojs"},{"id":1772,"value":"md`---\n\n\n----\n\n\n\n---\n\n\n\n----\n\n\n## Workspace/Scratch`","pinned":false,"hidden":false,"mode":"ojs"},{"id":624,"value":"viewBox = `${-minStrike} ${-50} ${-minStrike} ${100}`","pinned":true,"hidden":false,"mode":"ojs"},{"id":214,"value":"html`