2c:null 2d:["$","title",null,{"children":"\"To FAANG or NOT to FAANG, that is the question.\" | the_piranha | Observable"}] 32:Tbd4,# "To FAANG or NOT to FAANG, _that_ is the question." ##### - Raghav Sikaria, Sonali Singh Those of us belonging to the IT Industry, or initiated to the corporate world have all heard of the legendary 5 - FAANG. + Facebook + Apple + Amazon + Netflix + Google It's not surprising, that our parents, many of whom haven't got the first idea about Computer Science & Engineering, know of these companies all so well. Although, it's funny to us, that after Facebook became Meta, and Google turned to Alphabet, the monicker persists. What will it be really now though? MAANA? So it seems! Interestingly, there's another acronym in the town - **MAMAA** (drop Netflix and add Microsoft). And with the growing popularity of Tesla and its claims that it's a technology company, here's another one: **MAMATA**. Now we don't have anything personally against FAANG or these legendary companies. Indeed, they have contributed enormously to humankind. _Our problem lies here:_ **The current generation of Computer engineers competing to get into FAANG like it's the end of the world.** The mindset that FAANG is all that there is post-graduation and that it's not _'worth'_ to work for other companies is what we are after. Media and modern pop culture have glamorized FAANG enough. With this, let us introduce you to the objective of this blog piece - is FAANG really a class apart? Or is this just the same old _sample selection bias_? Since the scope is broad, we'll limit it to a purely fact-based Financials perspective using some commonly available financial metrics of FAANG and some of the other companies that we thought would be _capable_ (sarcasm?) of being their competitors. Before we start: ### **DISCLAIMER**: + This project and blog piece in no way recommend or give any financial advice + The contents of this project are not any form of financial fundamental analysis + This is purely a naive attempt to compare FAANG with its possible competitors and find any patterns purely from the aid of visualizations. The keyword is _naive_ since many companies are not even from the same domain. So let's get started, we just went through NASDAQ Index and found 15 companies that we thought out of conventional wisdom, would serve as good competitors to FAANG. We also through Costco Wholesale and Starbucks in the mix, for the sake of a variety of domains (outside Tech) and blatant humor. We've also added 5 companies that we believe are new age (they IPO'd in 2021), to just see how they fare against FAANG and the 15 competitors. This brings the total to 25 companies. **NOTE: ** All financial data based on Share Price is as of 1st December 2022, all other financial data has been extracted from the company's respective _latest annual statements_. ##### Here is our sample set: - **Competitors: ** Nvidia, Microsoft, Paypal, Oracle, Broadcom, Tesla, Uber, Salesforce, Adobe, Cisco, Qualcomm, Intel, Starbucks, Intuit, Costco - **New Age Startups (all IPO'd in 2021): ** Bumble, Coursera, Robinhood, Gitlab, Coinbase33:T47a,Before we try and observe anything, let us tell you, even trying to observe anything in this visualization is plainly **wrong**. Or worse, it is a _**sin**_. Looking at the share price of a company in isolation, and comparing it with the share prices of other companies (irrespective of the domain) is the biggest mistake a person can make. Let's see why? Take Broadcom, its share price is $550.75. What does that tell you? That on 1st December 2022, it was the best company as compared to these 24 others? Best in what sense? It was the most expensive company? Okay, but in what sense? Intuit is at $416.07. So does it mean that it was better than Adobe, Netflix, Microsoft, Google, Meta, and Apple? Share price does not answer any of these questions when looked at this way. Maybe you could take one company, see how its share price change over the course of a period, and maybe then, just maybe, try and figure out some things about that particular company. The share price does not even convey anything about the scale of the company. **Let's** find metrics that do: Market Capitalization, Revenues, Assets, and maybe the number of employees.34:T4b3,This tells a contrasting story as compared to the share price bubbles. _What's the market cap?_ Just multiply the number of outstanding shares for that company by the price of that share for the particular date and you will get the market capitalization for that company _for that particular date._ What does it tell you? Well, it's just one of the many measures of the scale of a company. It tells you how much the market (which is comprised of you, your friends, all other _retail_ investors, institutional investors, etc) think that the company is worth in the stock market. (this _thinking_ is often not right, think of the recent tech bubble burst, more thinking? how ironic!) Only the AAG seems to be standing out in FAANG. Surprisingly Tesla, Microsoft, and Nvidia have market caps higher than Meta and Netflix. The best kicker? Microsoft has the highest market cap, second only to Apple. We think MAMAA was the more apt monicker, _haha!_ And Broadcom which had the highest share value has a market cap of $236B higher than Netflix, but much, much smaller than the other giants. FAANG has not impressed us by standing out with its market cap. **Let's** look at their revenues and net profits.35:T893,Well, revenue is the total sales a company achieves, also called the _'top line'_, and net income/profit is the amount you arrive at after paying all costs, wages, taxes, etc, also called the _'bottom line'_. Like the market cap, they also tell us about the scale of a company. Depending on the stage of a company (embryo/start-up, growth, mature, etc), these numbers have a shift in priority. A high-growth company (maybe like Robinhood) will want to focus on getting a good top-line right now because that would mean capturing a bigger piece of the stock-broking market, or more customers! However, a seasoned company like Nvidia would want to optimize its bottom-line, because they already are mature in its respective market, and have to focus on & optimize the profits they generate. As they say, in the end, it's the real money - _the profit_ that matters. All the revenue in the world will not matter if you can't generate any profits in the foreseeable future. (_coughs_, "new age start-ups", _coughs more_) A company with higher revenue does not mean that it has a higher net profit. These items are at the extremums of the income statement of a company. And there is a big story that happens between these extremes. Numerous different line items like cost of goods sold, research & development costs, wages, administrative costs, depreciation, amortization costs, taxes, etc populate the statement. These line items bring in a lot of variability from the point of revenue to the net income. Each and every line item calls for optimization for different departments of the company. _How a company does that, well that is exactly what business and business management are all about!_ Amazon has the highest revenue by numbers, and by contrast Apple, Google, Microsoft, and (unbelievably) even Meta have higher net profits than Amazon. Costco Wholesale, which is not a technology company, does have higher revenue than Microsoft interestingly. FAANG along with Microsoft continues to dominate this scale also. And Netflix remains a disappointment. Tesla and Nvidia have disappeared after a big show of their market caps. **Let's** look at the number of employees these companies have.36:T86e,In the balance statement of a company, there are many different kinds of assets and liabilities. For the sake of simplicity and appealing to the uninitiated, we have chosen Cash (real money $$$) and Total Liabilities (all kinds of liabilities, summed up by their $$$ value). Like all the metrics above these also represent the scale of a company. Remember, in the Finance world, nothing is binary aka good or bad. The answer to any question is _it depends_. Why are we saying this? Because the layman feels that having a lot of cash is good, and having a lot of debt is bad. Well, since now we're no more the uninitiated, the right answer is: _"it depends"_. In gross oversimplification think of it like this, having too much cash might mean that the management of the company does not how to utilize their cash. This might then reflect poorly on them. Similarly, having great debt might mean that the company is confident about paying back to their lenders, possibly because they have an excellent outlook for their near future. Well, nothing is for certain, and situations like this definitely ask for an in-depth analysis. Keeping the above pointers in mind, FAANG plus Microsoft & minus Netflix continues to dominate this too, both in terms of cash and total liabilities. Intel & Oracle are surprise entries, coming behind Meta in terms of cash. Netflix has brought down the averages of FAANG members, it's like the member of the group who does not contribute at all to the project :) **BUT but** so far these metrics are unfairly biased to giants and FAANG in a sense because they give a true idea about their scale. Now one could argue that it gives these companies the advantage of being establishers of their respective market, having the early mover advantage, having truckloads of money simply because they have been operating for decades, etc. So now, we will look at normalized metrics. What does this mean? Well, some kind of metrics that mute this advantage of their enormously giant scale, which also include some commonly known financial ratios. **Let's** start with having a look at the current ratio and quick ratio of these companies:37:T92a,Before we try and study the visualization, what exactly are current and quick ratios? Well, they are found in line items in the Balance sheet of a company, and help in answering the question: "What position is the company currently in to meet all its short-term debt obligations, paying via its current assets?" Again, looking at them in isolation does not tell much, however, comparing them with the industry surely does convey some information. Being above the industry average means that they indeed are in a good position and vice versa. Both ratios have their _current liabilities_ in the denominator. There is a subtle difference between the 2 ratios. The current ratio has _current assets_ in the numerator, which are cash, marketable securities, inventory, accounts receivables, other current assets, etc. The Quick ratio on the other hand only has cash, marketable securities, and accounts receivables. Noticed yet? The Quick ratio, is stricter. It has removed comparatively illiquid assets from the numerator of the current ratio - like inventory, other current assets, etc. This also is the reason why it's called the **Acid Test Ratio**. By simple math, one can tell, that ratios being over 1 are definitely the desired condition to be in and that quick ratio will always be lesser than the current ratio. A look at the visualization now. It is so interesting to observe that there exists a simple linear relationship between the current and quick ratio. NVIDIA is like an undisputed outlier. Another observation, FAANG seems to have lost its lead here in this visualization. Meta surprisingly has good numbers. Coursera, Bumble, and Gitlab seem to be having tonnes of beginner's luck here, or is the business management for these companies really that great? Maybe these new-age startups have rationed more cash than needed for being prepared to tackle the uncertainties of the market. Netflix continues to be a disappointment, (a callback to Virat Kohli's performance this year?) but this time it's accompanied by Apple. It will be worth finding out why Apple has such ratios. We did see above, that it had the maximum total liabilities of all the companies. In general, FAANG has failed to impress us and stand out entirely with these metrics. **Let's** now look at the Revenue and Net Profit numbers again, but per employee:38:T416,But first, what is Days Sales Outstanding? Keeping technicalities aside, this metric tells us that, _on an average, how many days does a company take to collect the cash for the sale of the products or services they've made?_ Again, looking at the numbers in isolation does not help much. Comparing it with the industry average does convey meaningful information. You definitely don't want to be in a position, where you're taking longer time to collect your payments than your competitors. The investors will simply ask this question: _"Why are you taking longer than the rest?"_ Looking at the visualization, Paypal and RobinHood are immediate outliers. Surprisingly Netflix has continued its magical streak and has not only the lowest DSO for all of FAANG, but is also the second lowest among all companies. New-age companies are all over the place. In general, FAANG has failed to stand out in this metric. **Let's** now look at some fundamental Income Statement ratios - Gross Profit Margin, Operating Profit Margin and Net Profit Margin:39:T83b,What are these margins? Well, the topmost line item in an Income Statement is the revenue. Then follows the _cost of goods sold_ aka the cost of raw materials/goods that the company purchased to make those final products it sold. If we subtract this amount from the revenue, we get _Gross profit_. A company would ideally want to maximize this number. Price their goods as high as it is feasible for the market and business to get a higher revenue, and reduce the costs of purchasing those raw materials to achieve economies of scale. Dividing this number by the revenue gives us Gross Profit Margin. Now, from the revenue, along with subtracting the cost of goods, also subtract Operating expenses like administrative costs, wages, research & development costs, amortization, depreciation, etc and the number we arrive at now would be the _Operating profit_. A company would ideally want to maximize this number also. They'll want to optimize administrative costs, cut down on wages (a callback to recent mass lay-offs), etc. Dividing this number by the revenue gives us Operating Profit Margin. From the above number, go on and now also subtract interest payments and taxes. This number we arrive at is the Net Income or Net Profit. Dividing this number by the revenue gives us the Net Profit Margin. The definitions above are a gross oversimplification, and there is a lot of story and other variety of line items that inhabit the Income statement. One might assume that always GPM > OPM > NPM. However, there are certain _extra-ordinary_ line items that contradict this thought. Amazon, Uber, Bumble, etc are a few such anomalies that we can observe in the visualization. Why it is so, is beyond the scope of this project. Microsoft has a higher NPM than all of FAANG's. Among, FAANG, Meta has the best margins. New-age companies Robinhood and Gitlab are nowhere to be seen, they are _extreme_ outliers. In the end, FAANG has yet again failed to stand out from the rest with these margins. **Let's** now look at our last metric for the project. The Research & Development Costs of these companies:3a:T4d0,This does paint quite a different picture. FAANG has gone for a toss. Our underdogs, the new-age companies are leading the metric! Only Meta from FAANG has made it to the top 5, the rest are not even the in the picture! What is this happening? Why is this happening? We see a high percentage of revenue being spent on R&D for the new age start-ups because that is normal for companies in this stage. They are bringing a new product to the market, they have to innovate a lot which commands a great budget, and hence a higher percentage of the revenue. What does this mean for FAANG? Why is this percentage so low? Well, in this case, remember, this is just a percentage. The actual R&D spends of FAANG far outweigh the entire market caps of these companies (it's almost laughable). Take Alphabet, for example, its percentage is around 12% (as compared to Robinhood's ~67%), but the real amount of that R&D expenditure is ~ $32 Billion far greater than Robinhood's ~ $1 Billion. One must remember, that FAANG makes up for their low percentages by having enormously high revenue. They get access to way higher real R&D Budget, which enables them to innovate more! So in this case, looking at the percentages really does not help us.3b:Tde0,// RETURNS LOGO File Attachment // for each of the 25 companies function get_logo_map() { var logo_map = []; var fb_logo = FileAttachment("icons8-facebook-30.png"); var amazon_logo = FileAttachment("icons8-amazon-30.png"); var apple_logo = FileAttachment("icons8-apple-logo-30.png"); var tesla_logo = FileAttachment("icons8-tesla-48.png"); var netflix_logo = FileAttachment("icons8-netflix-desktop-app-48.png"); var google_logo = FileAttachment("icons8-google-48.png"); var microsoft_logo = FileAttachment("icons8-microsoft-48.png"); var nvidia_logo = FileAttachment("icons8-nvidia-48.png"); var paypal_logo = FileAttachment("icons8-paypal-48.png"); var oracle_logo = FileAttachment("icons8-oracle-logo-48.png"); var broadcom_logo = FileAttachment("Broadcom-Logo-1991.png"); var uber_logo = FileAttachment("icons8-uber-48.png"); var salesforce_logo = FileAttachment("icons8-salesforce-48.png"); var adobe_logo = FileAttachment("icons8-adobe-64.png"); var cisco_logo = FileAttachment("cisco-emblem.jpeg"); var qualcom_logo = FileAttachment("Qualcomm-Logo.png"); var intel_logo = FileAttachment("icons8-intel-corporation-an-american-multinational-corporation-and-technology-company-96.png"); var starbucks_logo = FileAttachment("icons8-starbucks-96.png"); var inuit_logo = FileAttachment("1200px-Intuit_Logo.svg.png"); var costco_logo = FileAttachment("Costco-logo.png"); var bumble_logo = FileAttachment("icons8-bumble-64.png"); var coursera_logo = FileAttachment("Coursera-Logo.png"); var robinhood_logo = FileAttachment("Robinhood-logo.png"); var gitlab_logo = FileAttachment("Gitlab-Logo.png"); var coinbase_logo = FileAttachment("Coinbase-logo.png"); logo_map = { "Facebook/Meta": {"logo_attach": fb_logo, "height": 25, "width": 25}, "Amazon": {"logo_attach": amazon_logo, "height": 25, "width": 25}, "Apple": {"logo_attach": apple_logo, "height": 25, "width": 25}, "Netflix": {"logo_attach": netflix_logo, "height": 25, "width": 25}, "Tesla": {"logo_attach": tesla_logo, "height": 30, "width": 30}, "Microsoft": {"logo_attach": microsoft_logo, "height": 25, "width": 25}, "Alphabet": {"logo_attach": google_logo, "height": 25, "width": 25}, "Nvidia": {"logo_attach": nvidia_logo, "height": 25, "width": 25}, "Paypal": {"logo_attach": paypal_logo, "height": 25, "width": 25}, "Oracle": {"logo_attach": oracle_logo, "height": 50, "width": 40}, "Broadcom": {"logo_attach": broadcom_logo, "height": 60, "width": 50}, "Uber": {"logo_attach": uber_logo, "height": 22, "width": 22}, "Salesforce": {"logo_attach": salesforce_logo, "height": 32, "width": 32}, "Adobe": {"logo_attach": adobe_logo, "height": 20, "width": 20}, "Cisco": {"logo_attach": cisco_logo, "height": 27, "width": 27}, "Qualcom": {"logo_attach": qualcom_logo, "height": 50, "width": 50}, "Intel": {"logo_attach": intel_logo, "height": 27, "width": 27}, "Starbucks": {"logo_attach": starbucks_logo, "height": 25, "width": 25}, "Intuit": {"logo_attach": inuit_logo, "height": 35, "width": 35}, "Costco": {"logo_attach": costco_logo, "height": 35, "width": 35}, "Bumble": {"logo_attach": bumble_logo, "height": 25, "width": 25}, "Coursera": {"logo_attach": coursera_logo, "height": 50, "width": 50}, "Robinhood": {"logo_attach": robinhood_logo, "height": 50, "width": 50}, "Gitlab": {"logo_attach": gitlab_logo, "height": 40, "width": 40}, "Coinbase": {"logo_attach": coinbase_logo, "height": 50, "width": 50} } return logo_map }3c:Tafe,function get_share_price_vis(data, { something = 10 } = {}){ function custom_text_color(p) { if (p < 150){return "black";} else{return "white"} } function custom_stroke_color(c) { if (faang.includes(c)){return "#e60049";} else if(new_age.includes(c)){return "#0bb4ff";} else{return "";} } function custom_stroke_width(c) { if (faang.includes(c)){return 6;} else if(new_age.includes(c)){return 5;} else{return 0;} } const dataset_1 = {"children": data}; var diameter = 800; var bubble = d3.pack(dataset_1).size([diameter, diameter]).padding(1.5); var svg = d3.create('svg') .attr("width", diameter) .attr("height", diameter + 20) .attr("class", "bubble"); svg.append('g') .attr('transform', `translate(${diameter/2 - 85},${diameter - 140})`) .append(() => Legend(d3.scaleOrdinal(["FAANG", "New Age Start-Ups"], ["#e60049", "#0bb4ff"]), {width: 130, height: 46})); svg.append("text") .attr("x", diameter / 2) .attr("y", diameter-170) .attr("text-anchor", "middle") .attr("dominant-baseline", "hanging") .attr("font-family", "Arial") .attr("font-size", "30px") .text("Share Prices"); svg.append("text") .attr("x", diameter / 2 - 28) .attr("y", diameter-140) .attr("text-anchor", "middle") .attr("dominant-baseline", "hanging") .attr("font-family", "Arial") .attr("font-size", "11px") .text("as on 1st December'22"); const color = d3.scaleSequential().domain([-300, d3.max(data, d => d.share_price)]).interpolator(d3.interpolateOranges) var nodes = d3.hierarchy(dataset_1).sum(d => d.share_price); var node = svg.selectAll(".node") .data(bubble(nodes).descendants()) .enter() .filter(d => !d.children) .append("g") .attr("class", "node") .attr("transform", d => "translate(" + d.x + "," + d.y + ")"); node.append("circle") .attr("r", d => d.r) .style("fill", (d,i) => color(data[i]["share_price"])) .style("stroke", (d,i) => custom_stroke_color(data[i]["company"])) .style("stroke-width", (d,i) => custom_stroke_width(data[i]["company"])); node.append("text") .attr("dy", ".2em") .style("text-anchor", "middle") .text(d => d.data.company) .attr("font-family", "sans-serif") .attr("font-size", d => d.r/4) .attr("fill", d => custom_text_color(d.data.share_price)); node.append("text") .attr("dy", "1.3em") .style("text-anchor", "middle") .text(d => "$" + d.data.share_price) .attr("font-family", "Gill Sans", "Gill Sans MT") .attr("font-size", d => d.r/5) .attr("fill", d => custom_text_color(d.data.share_price)); return svg.node(); }3d:Tb51,function get_market_cap_vis(data, { something = 10 } = {}){ const dataset_1 = {"children": data}; function custom_text_color(mcap) { if (mcap < 620720.1){return "black";} else{return "white"} } function custom_stroke_color(c) { if (faang.includes(c)){return "#e60049";} else if(new_age.includes(c)){return "#0bb4ff";} else{return "";} } function custom_stroke_width(c) { if (faang.includes(c)){return 6;} else if(new_age.includes(c)){return 2;} else{return 0;} } var diameter = 700; var bubble = d3.pack(dataset_1).size([diameter, diameter]).padding(0.5); var svg = d3.create('svg') .attr("width", diameter) .attr("height", diameter + 20) .attr("class", "bubble"); svg.append('g') .attr('transform', `translate(${diameter/2 - 320},${diameter/2 + 250})`) .append(() => Legend(d3.scaleOrdinal(["FAANG", "New Age Start-Ups"], ["#e60049", "#0bb4ff"]), {width: 130, height: 46})); svg.append("text") .attr("x", diameter/2 - 180) .attr("y", diameter/2 + 220) .attr("text-anchor", "middle") .attr("dominant-baseline", "hanging") .attr("font-family", "Arial") .attr("font-size", "30px") .text("Market Capitalization"); svg.append("text") .attr("x", diameter/2 - 220) .attr("y", diameter/2 + 250) .attr("text-anchor", "middle") .attr("dominant-baseline", "hanging") .attr("font-family", "Arial") .attr("font-size", "11px") .text("as on 1st December'22 in Billions of $$$"); const color = d3.scaleSequential().domain([-300, d3.max(data, d => d.market_cap)]).interpolator(d3.interpolateGreys) var nodes = d3.hierarchy(dataset_1).sum(d => d.market_cap); var node = svg.selectAll(".node") .data(bubble(nodes).descendants()) .enter() .filter(d => !d.children) .append("g") .attr("class", "node") .attr("transform", d => "translate(" + d.x + "," + d.y + ")"); node.append("circle") .attr("r", d => d.r) .style("fill", (d,i) => color(data[i]["market_cap"])) .style("stroke", (d,i) => custom_stroke_color(data[i]["company"])) .style("stroke-width", (d,i) => custom_stroke_width(data[i]["company"])); node.append("text") .attr("dy", ".2em") .style("text-anchor", "middle") .text(d => d.data.company) .attr("font-family", "sans-serif") .attr("font-size", d => d.r/4) .attr("fill", d => custom_text_color(d.data.market_cap)); node.append("text") .attr("dy", "1.3em") .style("text-anchor", "middle") .text(d => "$" + Math.round((d.data.market_cap * 1000000)/1000000000) + "B") .attr("font-family", "Gill Sans", "Gill Sans MT") .attr("font-size", d => d.r/5) .attr("fill", d => custom_text_color(d.data.market_cap)); return svg.node(); }3e:T102b,async function get_revenue_vs_netprofit_vis(data, { something = 10 } = {}){ var logo_map = get_logo_map(); function average_of_target_companies(criteria) { var answer = 0; for (const item of data) { if (faang.includes(item["company"])) {answer+= item[criteria];} } return answer/faang.length; } function get_custom_size(revenue, net_profit) { if (net_profit < 10000 && revenue < 75000){return 20;} else {return 30;} } function get_custom_axis_label(label_value) { return (label_value/1000) + "B"; } const margin = {top: 10, right: 120, bottom: 20, left: 60}; const visWidth = 600; const visHeight = 600; const svg = d3.create('svg') .attr('width', visWidth + margin.left + margin.right) .attr('height', visHeight + margin.top + margin.bottom); const g = svg.append("g").attr("transform", `translate(${margin.left}, ${margin.top})`); g.append("text") .attr("x", 10) .attr("y", 55) .attr("font-family", "arial") .attr("font-size", "30px") .text("Revenue vs Net Profit"); g.append("text") .attr("x", 10) .attr("y", 67) .attr("font-family", "arial") .attr("font-size", "12px") .text("as of their latest annual income statements in Billions of $$$ (Dec'22)"); g.append("text") .attr("x", 10) .attr("y", 80) .attr("font-family", "arial") .attr("font-size", "9px") .text("*red line marks respective averages for FAANG"); const x = d3.scaleLinear().domain(d3.extent(data, d => d["revenue"])).nice().range([0, visWidth]); const y = d3.scaleLinear().domain(d3.extent(data, d => d["net_profit"])).nice().range([visHeight, 0]); const xAxis = d3.axisBottom(x).tickFormat((d,i) => get_custom_axis_label(d)); const yAxis = d3.axisLeft(y).tickFormat((d,i) => get_custom_axis_label(d)); const average_net_profit_in_faang = average_of_target_companies("net_profit"); const average_revenue_in_faang = average_of_target_companies("revenue"); g.append("g") .attr("transform", `translate(0, ${y(0)})`) .call(xAxis) .call(g => g.selectAll('.tick line') .clone() .attr('stroke', '#d3d3d3') .attr('y1', -visHeight + y(90000)) .attr('y2', +55) .attr('opacity', 0.4)) .append("text") .attr("x", visWidth / 2) .attr("y", 40 + 30) .attr("fill", "black") .attr("text-anchor", "middle") .attr("font-size", 14) .text("Revenue"); g.append("g") .call(yAxis) .call(g => g.selectAll('.tick line') .clone() .attr('stroke', '#d3d3d3') .attr('x1', 0) .attr('x2', visWidth) .attr('opacity', 0.4)) .append("text") .attr("fill", "black") .attr("dominant-baseline", "middle") .attr('transform', 'translate(-47,' + visHeight/2.5 + ') rotate(270)') .attr("font-size", 14) .text("Net Profit"); g.append('line') .attr('x1', x(0)) .attr('x2', x(500000)) .attr('y1', y(0)) .attr('y2', y(0)) .attr('stroke', 'black'); g.append('line') .attr('x1', x(0)) .attr('x2', x(500000)) .attr('y1', y(average_net_profit_in_faang)) .attr('y2', y(average_net_profit_in_faang)) .attr('stroke', 'red'); g.append('line') .attr('x1', x(average_revenue_in_faang)) .attr('x2', x(average_revenue_in_faang)) .attr('y1', y(-10000)) .attr('y2', y(100000)) .attr('stroke', 'red'); // CODE FOR PLOTTING POINTS ON SCATTER PLOT // g.append("g") // .selectAll("circle") // .data(data) // .join("circle") // .attr("cx", d => x(d["revenue"])) // .attr("cy", d => y(d["net_profit"])) // // .attr("fill", d => irisColor(d.class)) // .attr("r", 3); for(const i of data) { if (i.company in logo_map) { g.append("image") .attr('x', x(i.revenue)) .attr('y', y(i.net_profit)) .attr("xlink:href", await logo_map[i.company].logo_attach.url()) .attr('width', await logo_map[i.company].width) .attr('height', await logo_map[i.company].height); } } return svg.node(); }3f:T10a0,function get_number_of_employees_vis(data, { something = 10 } = {}){ function average_of_target_companies(target) { var answer = 0; for (const item of data) { if (target.includes(item["company"])) {answer+= item["number_of_employees"];} } return answer/target.length; } function custom_color_for_bar(company) { if (faang.includes(company)) { return "#e60049"; } else if (new_age.includes(company)) { return "#0bb4ff"; } else { return "#e6d800"; } } const margin = {top: 30, right: 50, bottom: 30, left: 80}; const visWidth = width - margin.left - margin.right - 300; const visHeight = 600 - margin.top - margin.bottom; const svg = d3.create('svg') .attr('width', visWidth + margin.left + margin.right) .attr('height', visHeight + margin.top + margin.bottom); const g = svg.append("g").attr("transform", `translate(${margin.left}, ${margin.top})`); g.append('g') .attr('transform', `translate(${visWidth - 300},${-margin.top + 255})`) .append(() => Legend(d3.scaleOrdinal(["FAANG", "New Age Start-Ups", "Competitors"], ["#e60049", "#0bb4ff", "#e6d800"]), {})); g.append("text") .attr("x", visWidth - 300) .attr("y", -margin.top + 250) .attr("font-family", "arial") .attr("font-size", 32) .text("Number of Employees"); g.append("text") .attr("x", visWidth - 300) .attr("y", -margin.top + 267) .attr("font-family", "arial") .attr("font-size", 12) .text("as of their latest annual statements (Dec'22)"); g.append("text") .attr("x", visWidth - 300) .attr("y", -margin.top + 315) .attr("font-family", "arial") .attr("font-size", 9) .text("*red line marks average number of employees for FAANG"); const average_number_of_employees_in_new_age = average_of_target_companies(new_age); const average_number_of_employees_in_faang = average_of_target_companies(faang); const x = d3.scaleLinear() .domain([0, d3.max(data, d => d.number_of_employees)]) .range([0, visWidth]); const y = d3.scaleBand() .domain(Array.from(data.sort(function(a, b){return b["number_of_employees"] - a["number_of_employees"]}), d => d.company)) .range([0, visHeight]) .padding(0.2); const xAxis = d3.axisBottom(x); g.append("g") .attr("transform", `translate(0, ${visHeight})`) .call(xAxis); // .call(g => g.select(".domain").remove()) // .append("text") // .attr("x", visWidth / 2) // .attr("y", 40) // .attr("fill", "black") // .attr("text-anchor", "middle") // .attr("font-size", 20) // .text("Number of Employees"); const yAxis = d3.axisLeft(y); g.append("g") .call(yAxis); // remove baseline from the axis // .call(g => g.select(".domain").remove()) // .append("text") // // .attr("x", -margin.left) // // .attr("y", visHeight / 2) // .attr("fill", "black") // .attr("dominant-baseline", "middle") // .attr('transform', 'translate(-95,' + visHeight/2.5 + ') rotate(270)') // .attr("text-anchor", "middle") // .attr("font-size", 20) // .text("Companies"); g.append('line') .attr('x1', x(average_number_of_employees_in_faang)) .attr('x2', x(average_number_of_employees_in_faang)) .attr('y1', 0) .attr('y2', visHeight) .attr('stroke', '#e60049'); g.append('line') .attr('x1', x(average_number_of_employees_in_new_age)) .attr('x2', x(average_number_of_employees_in_new_age)) .attr('y1', 0) .attr('y2', visHeight) .attr('stroke', 'green'); g.append("g") .selectAll("rect") .data(data) .join("rect") .attr("x", d => 0) .attr("y", d => y(d.company)) .attr("width", d => x(d.number_of_employees)) .attr("height", d => y.bandwidth()) .attr("fill", d => custom_color_for_bar(d.company)); for (const i of data) { if (i.number_of_employees < 53000) { g.append("text") .text(i.number_of_employees) .attr("fill", "black") .attr("font-size", 9) .attr("x", x(i.number_of_employees) + 5) .attr("y", y(i.company) + 12); } } return svg.node(); }40:T1c91,async function get_cash_and_liabilities_vis(data, { something = 10 } = {}){ var logo_map = get_logo_map(); function custom_color_for_bar(net_cash) { if (net_cash < 0){return "red";} else{return "green";} } function get_average(criteria) { var answer = 0; for (const item of data) { if (faang.includes(item["company"])) {answer+= item[criteria];} } return answer/faang.length; } function get_custom_y_axis_label(label_value) { return (label_value/1000000000) + "B"; } function get_custom_x_axis_label(c) { if (faang.includes(c)){return '';} else {return '';} } // Graph Specifics const margin = ({top: 30, bottom: 45, left: 75, right: 10}); const visWidth = width - margin.left - margin.right - 200; const visHeight = 600 - margin.top - margin.bottom; // SCALES for X and Y AXIS const cash_scale = d3.scaleLinear() .domain([-302083, 139649]) .range([visHeight, 0]); const companies_scale = d3.scaleBand() .domain(Array.from(data, d => d.company)) .range([0, visWidth]) .padding(0.2); const xScale = d3.scaleBand() .domain(Array.from(data, d => d.company)) .range([0, visWidth]) .padding(0.1); const xAxis = d3.axisBottom(companies_scale).tickFormat((d,i) => get_custom_x_axis_label(d)).tickSize(0); const yAxis = d3.axisLeft(cash_scale).tickFormat((d,i) => get_custom_y_axis_label(d*1000000)); const svg = d3.create('svg') .attr('width', visWidth + margin.left + margin.right) .attr('height', visHeight + margin.top + margin.bottom); const g = svg.append("g") .attr('transform', `translate(${margin.left}, ${margin.top})`); g.append("text") .attr("x", visWidth - 500) .attr("y", -margin.top + 450) .attr("font-family", "arial") .attr("font-size", 30) .text("Cash & Equivalents vs Total Liabilities"); g.append("text") .attr("x", visWidth - 500) .attr("y", -margin.top + 467) .attr("font-family", "arial") .attr("font-size", 12) .text("as of their latest annual balance sheet statements (Dec'22)"); g.append("text") .attr("x", visWidth - 500) .attr("y", -margin.top + 477) .attr("font-family", "arial") .attr("font-size", 9) .text("*red & blue lines mark respective averages for FAANG"); // TITLE for GRAPH // g.append("text") // .attr("x", visWidth / 2) // .attr("y", -margin.top + 5) // .attr("text-anchor", "middle") // .attr("dominant-baseline", "hanging") // .attr("font-family", "sans-serif") // .attr("font-size", "16px") // .text("Unemployment Rate across all states in the USA for December 2019"); g.selectAll('lines') .data(data) .join('line') .attr('x1', d => companies_scale(d.company)) .attr('x2', d => companies_scale(d.company)) .attr('y1', d => cash_scale(d.cash)) .attr('y2', d => cash_scale(0)) .attr('stroke', 'lightgray'); for(const i of data) { g.append('line') .attr('x1', companies_scale(i.company)) .attr('x2', companies_scale(i.company)) .attr('y1', cash_scale(0)) .attr('y2', cash_scale(-1 * i.total_liabilities)) .attr('stroke', 'red'); } let bar_width = companies_scale.bandwidth()/2.5 for(const i of data) { if (i["net_cash"] >= 0) { g.append('rect') .attr("x", d => companies_scale(i.company) - bar_width/2) .attr("y", d => cash_scale(i.net_cash)) .attr("width", bar_width) .attr("height", d => cash_scale(0) - cash_scale(i.net_cash)) .attr("fill", d => custom_color_for_bar(i.net_cash)) .attr("opacity", 0.4); } else { // console.log("y: " + cash_scale(0) + " height: " + cash_scale(i.net_cash) + " i.net_cash: " + i.net_cash); g.append('rect') .attr("x", d => companies_scale(i.company) - bar_width/2) .attr("y", d => cash_scale(0)) .attr("width", bar_width) // cash_scale(0) .attr("height", d => cash_scale(i.net_cash) - cash_scale(0)) .attr("fill", d => custom_color_for_bar(i.net_cash)) .attr("opacity", 0.4); } } // g.selectAll('circle') // .data(data) // .join('circle') // .attr('cx', d => companies_scale(d.company)) // .attr('cy', d => cash_scale(d.cash)) // .attr('r', 5) // .attr('fill', 'steelblue'); for(const i of data) { if (!faang.includes(i.company)) { g.append('circle') .attr('cx', d => companies_scale(i.company)) .attr('cy', d => cash_scale(i.cash)) .attr('r', 3) .attr('fill', 'steelblue') .attr('opacity', 0.5); } } for(const i of data) { if (!faang.includes(i.company)) { g.append('circle') .attr('cx', d => companies_scale(i.company)) .attr('cy', d => cash_scale(-1 * i.total_liabilities)) .attr('r', 3) .attr('fill', 'red') .attr('opacity', 0.5); } } g.append('line') .attr('x1', 0) .attr('x2', visWidth) .attr('y1', cash_scale(get_average("cash"))) .attr('y2', cash_scale(get_average("cash"))) .attr('stroke', 'red') .attr('stroke-width', 1.4); g.append('line') .attr('x1', 0) .attr('x2', visWidth) .attr('y1', cash_scale(-1 * get_average("total_liabilities"))) .attr('y2', cash_scale(-1 * get_average("total_liabilities"))) .attr('stroke', 'blue') .attr('stroke-width', 1.1); g.append('g') .call(yAxis) .append("text") // .attr("x", -margin.left) // .attr("y", cash_scale(0)) .attr("fill", "black") .attr("dominant-baseline", "middle") .attr('transform', 'translate(-45,' + visHeight/2 + ') rotate(270)') .attr("text-anchor", "middle") .attr("font-family", "arial") .attr("font-size", "14px") .text("<- Total Liabilities"); g.append("text") // .attr("x", -margin.left) // .attr("y", cash_scale(0)) .attr("fill", "black") .attr("dominant-baseline", "middle") .attr('transform', 'translate(-45,' + visHeight/5.8 + ') rotate(270)') .attr("text-anchor", "middle") .attr("font-family", "arial") .attr("font-size", "14px") .text("Cash & Equivalents ->"); g.append('g') .attr('transform', `translate(0, ${cash_scale(0)})`) .call(xAxis); // .append('text') // .attr('fill', 'black') // .attr('font-family', 'sans-serif') // .attr('x', visWidth / 2) // .attr('y', 40) // .text("Companies"); for(const i of data) { if (faang.includes(i.company)) { g.append("image") .attr('x', companies_scale(i.company) - 10) .attr('y', cash_scale(i.cash) - 15) .attr("xlink:href", await logo_map[i.company].logo_attach.url()) .attr('width', await logo_map[i.company].width) .attr('height', await logo_map[i.company].height); } g.append("image") .attr('x', companies_scale(i.company) - 10) .attr('y', cash_scale(-1 * i.total_liabilities) - 5) .attr("xlink:href", await logo_map[i.company].logo_attach.url()) .attr('width', await logo_map[i.company].width) .attr('height', await logo_map[i.company].height); // } } return svg.node(); }41:Tb24,function get_r_d_vis(data, { something = 10 } = {}){ function custom_text_color(rd) { if (rd < 30000){return "black";} else{return "white"} } function custom_stroke_color(c) { if (faang.includes(c)){return "#e60049";} else if(new_age.includes(c)){return "#0bb4ff";} else{return "";} } function custom_stroke_width(c) { if (faang.includes(c)){return 6;} else if(new_age.includes(c)){return 3;} else{return 0;} } const dataset_1 = {"children": data}; var diameter = 750; var bubble = d3.pack(dataset_1).size([diameter, diameter]).padding(1.5); var svg = d3.create('svg') .attr("width", diameter) .attr("height", diameter + 20) .attr("class", "bubble"); svg.append('g') .attr('transform', `translate(${0},${diameter - 22})`) .append(() => Legend(d3.scaleOrdinal(["FAANG", "New Age Start-Ups"], ["#e60049", "#0bb4ff"]), {width: 130, height: 45})); svg.append("text") .attr("x", diameter/2 - 220) .attr("y", diameter - 35) .attr("text-anchor", "middle") .attr("dominant-baseline", "hanging") .attr("font-family", "Arial") .attr("font-size", "18px") .text("Research & Development Expenditure"); svg.append("text") .attr("x", diameter/2 - 205) .attr("y", diameter - 17) .attr("text-anchor", "middle") .attr("dominant-baseline", "hanging") .attr("font-family", "Arial") .attr("font-size", "11px") .text("as of their latest annual income statements in Billions of $$$ (Dec'22)"); const color = d3.scaleSequential().domain([-300, d3.max(data, d => d.r_d)]).interpolator(d3.interpolateBlues) var nodes = d3.hierarchy(dataset_1).sum(d => d.r_d); var node = svg.selectAll(".node") .data(bubble(nodes).descendants()) .enter() .filter(d => !d.children) .append("g") .attr("class", "node") .attr("transform", d => "translate(" + d.x + "," + d.y + ")"); node.append("circle") .attr("r", d => d.r) .style("fill", (d,i) => color(data[i]["r_d"])) .style("stroke", (d,i) => custom_stroke_color(data[i]["company"])) .style("stroke-width", (d,i) => custom_stroke_width(data[i]["company"])) ; node.append("text") .attr("dy", ".2em") .style("text-anchor", "middle") .text(d => d.data.company) .attr("font-family", "sans-serif") .attr("font-size", d => d.r/4) .attr("fill", d => custom_text_color(d.data.r_d)); node.append("text") .attr("dy", "1.3em") .style("text-anchor", "middle") .text(d => "$" + Math.round(d.data.r_d/1000) + "B") .attr("font-family", "Gill Sans", "Gill Sans MT") .attr("font-size", d => d.r/5) .attr("fill", d => custom_text_color(d.data.r_d)); return svg.node(); }42:Tf19,async function get_current_vs_quick_ratio_vis(data, { something = 10 } = {}){ var logo_map = get_logo_map(); function average_of_target_companies(criteria) { var answer = 0; for (const item of data) { if (faang.includes(item["company"])) {answer+= item[criteria];} } return answer/faang.length; } function get_custom_size(quick_ratio, current_ratio) { if (quick_ratio < 1 && current_ratio < 1){return 30;} else {return 40;} } const margin = {top: 50, right: 120, bottom: 10, left: 20}; const visWidth = 600; const visHeight = 600; const svg = d3.create('svg') .attr('width', visWidth + margin.left + margin.right) .attr('height', visHeight + margin.top + margin.bottom); const g = svg.append("g").attr("transform", `translate(${margin.left}, ${margin.top})`); g.append("text") .attr("x", visWidth / 2 - 130) .attr("y", -margin.top + 120) .attr("font-family", "arial") .attr("font-size", "30px") .text("Current Ratio vs Quick Ratio"); g.append("text") .attr("x", visWidth / 2 - 130) .attr("y", -margin.top + 133) .attr("font-family", "Arial") .attr("font-size", "12px") .text("as of their latest annual balance sheets (Dec'22)"); g.append("text") .attr("x", visWidth / 2 - 130) .attr("y", -margin.top + 143) .attr("font-family", "Arial") .attr("font-size", "9px") .text("*red lines mark respective averages for FAANG"); const x = d3.scaleLinear().domain(d3.extent(data, d => d["quick_ratio"])).nice().range([0, visWidth]); const y = d3.scaleLinear().domain(d3.extent(data, d => d["current_ratio"])).nice().range([visHeight, 0]); const xAxis = d3.axisBottom(x); const yAxis = d3.axisLeft(y); //avg of the current and quick ratios const average_current_ratio_in_faang = average_of_target_companies("current_ratio"); const average_quick_ratio_in_faang = average_of_target_companies("quick_ratio"); g.append("g") .attr("transform", `translate(0, ${y(1)})`) .call(xAxis) .call(g => g.selectAll('.tick line') .clone() .attr('stroke', '#d3d3d3') .attr('y1', -visHeight + y(6.5)) .attr('y2', + 45) .attr('opacity', 0.4)) .append("text") .attr("x", visWidth / 2) .attr("y", 40) .attr("fill", "black") .attr("text-anchor", "middle") .attr("font-size", 14) .text("Quick Ratio"); g.append("g") .attr("transform", `translate(${x(1)}, 0)`) .call(yAxis) .call(g => g.selectAll('.tick line') .clone() .attr('stroke', '#d3d3d3') .attr('x1', -x(1)) .attr('x2', x(6.5)-x(1)) .attr('opacity', 0.4)) .append("text") .attr("fill", "black") .attr("dominant-baseline", "middle") .attr('transform', 'translate(-40,' + visHeight/2.5 + ') rotate(270)') .attr("font-size", 14) .text("Current Ratio"); g.append('line') .attr('x1', x(0)) .attr('x2', x(0)) .attr('y1', y(0)) .attr('y2', y(0)) .attr('stroke', 'black'); g.append('line') .attr('x1', x(0)) .attr('x2', x(6.5)) .attr('y1', y(average_current_ratio_in_faang)) .attr('y2', y(average_current_ratio_in_faang)) .attr('stroke', 'red'); g.append('line') .attr('x1', x(average_quick_ratio_in_faang)) .attr('x2', x(average_quick_ratio_in_faang)) .attr('y1', y(0.5)) .attr('y2', y(7)) .attr('stroke', 'red'); for(const i of data) { if (i.company in logo_map) { g.append("image") .attr('x', x(i.quick_ratio)) .attr('y', y(i.current_ratio)) .attr("xlink:href", await logo_map[i.company].logo_attach.url()) .attr('width', await logo_map[i.company].width) .attr('height', await logo_map[i.company].height); } } return svg.node(); }43:T1575,async function get_netprofit_vs_revenue_per_employee_vis(data, { something = 10 } = {}){ var logo_map = get_logo_map(); function average_of_target_companies(criteria) { var answer = 0; for (const item of data) { if (faang.includes(item["company"])) {answer+= item[criteria];} } return answer/faang.length; } function get_custom_size(net_profit_per_employee, revenue_per_employee) { if (net_profit_per_employee < 1.5 && revenue_per_employee < 0.4){return 20;} else {return 30;} } function get_custom_axis_label(label_value) { if (label_value === 0){return "0";} if (label_value < 1000000) { return ((label_value/100000)*100) + "K"; } else { return (label_value/1000000) + "M"; } } const margin = {top: 50, right: 120, bottom: 40, left: 60}; const visWidth = 600; const visHeight = 600; const svg = d3.create('svg') .attr('width', visWidth + margin.left + margin.right) .attr('height', visHeight + margin.top + margin.bottom); const g = svg.append("g").attr("transform", `translate(${margin.left}, ${margin.top})`); g.append("text") .attr("x", 40) .attr("y", -margin.top + 130) .attr("font-family", "arial") .attr("font-size", "30px") .text("Net Profit vs Revenue"); g.append("text") .attr("x", 40) .attr("y", -margin.top + 155) .attr("font-family", "arial") .attr("font-size", "30px") .text("Per Employee"); g.append("text") .attr("x", 40) .attr("y", -margin.top + 170) .attr("font-family", "arial") .attr("font-size", "12px") .text("as of their latest annual income statements (Dec'22)"); g.append("text") .attr("x", 40) .attr("y", -margin.top + 180) .attr("font-family", "arial") .attr("font-size", "9px") .text("*red line marks respective averages for FAANG"); const x = d3.scaleLinear().domain(d3.extent(data, d => d["revenue_per_employee"])).nice().range([0, visWidth]); // const y = d3.scaleLinear().domain(d3.extent(data, d => d["net_profit_per_employee"])).nice().range([visHeight, 0]); const y = d3.scaleLinear().domain([-0.35,0.8]).range([visHeight, 0]); const xAxis = d3.axisBottom(x).tickFormat((d,i) => get_custom_axis_label(d * 1000000)); const yAxis = d3.axisLeft(y).tickFormat((d,i) => get_custom_axis_label(d * 1000000)); const average_revenue_per_employee_in_faang = average_of_target_companies("revenue_per_employee"); const average_net_profit_per_employee_in_faang = average_of_target_companies("net_profit_per_employee"); g.append("g") .attr("transform", `translate(0, ${y(0)})`) .call(xAxis) .call(g => g.selectAll('.tick line') .clone() .attr('stroke', '#d3d3d3') .attr('y1', -visHeight + y(0) - 237) .attr('y2', + 185) .attr('opacity', 0.4)) .append("text") .attr("x", visWidth / 2) .attr("y", 40) .attr("fill", "black") .attr("text-anchor", "middle") .attr("font-size", 12) .attr("font-family", "arial") .text("Revenue Per Employee"); g.append("g") .call(yAxis) .call(g => g.selectAll('.tick line') .clone() .attr('stroke', '#d3d3d3') .attr('x1', 0) .attr('x2', visWidth) .attr('opacity', 0.4)) .append("text") .attr("fill", "black") .attr("dominant-baseline", "middle") .attr('transform', 'translate(-50,' + visHeight/2.5 + ') rotate(270)') .attr("font-size", 12) .attr("font-family", "arial") .text("Net Profit Per Employee"); g.append('line') .attr('x1', x(0)) .attr('x2', x(2.8)) .attr('y1', y(0)) .attr('y2', y(0)) .attr('stroke', 'black'); g.append('line') .attr('x1', x(0)) .attr('x2', x(2.8)) .attr('y1', y(average_net_profit_per_employee_in_faang)) .attr('y2', y(average_net_profit_per_employee_in_faang)) .attr('stroke', 'red'); g.append('line') .attr('x1', x(average_revenue_per_employee_in_faang)) .attr('x2', x(average_revenue_per_employee_in_faang)) .attr('y1', y(0.8)) .attr('y2', y(-0.34)) .attr('stroke', 'red'); // CODE FOR PLOTTING POINTS ON SCATTER PLOT // g.append("g") // .selectAll("circle") // .data(data) // .join("circle") // .attr("cx", d => x(d["revenue"])) // .attr("cy", d => y(d["net_profit"])) // // .attr("fill", d => irisColor(d.class)) // .attr("r", 3); for(const i of data) { if (i.company in logo_map) { if (i.company == "Robinhood") { g.append("image") .attr('x', x(i.revenue_per_employee)) .attr('y', y(-0.25)) .attr("xlink:href", await logo_map[i.company].logo_attach.url()) .attr('width', await logo_map[i.company].width) .attr('height', await logo_map[i.company].height); g.append("text") .text("(-1M $$$ [outlier])") .attr("fill", "black") .attr("font-size", 12) .attr("x", x(i.revenue_per_employee) - 17) .attr("y", y(-0.33)); } else { g.append("image") .attr('x', x(i.revenue_per_employee)) .attr('y', y(i.net_profit_per_employee)) .attr("xlink:href", await logo_map[i.company].logo_attach.url()) .attr('width', await logo_map[i.company].width) .attr('height', await logo_map[i.company].height); } } } return svg.node(); }44:T18f3,async function get_dso_vis(data, { something = 10 } = {}){ var logo_map = get_logo_map(); function average_of_target_companies(target) { var answer = 0; for (const item of data) { if (target.includes(item["company"])) {answer+= item["dso"];} } return answer/target.length; } const margin = {top: 20, bottom: 5, left: 55, right: 20} const visWidth = width - margin.left - margin.right - 150 const visHeight = 400 - margin.top - margin.bottom const svg = d3.create('svg') .attr('width', visWidth + margin.left + margin.right) .attr('height', visHeight + margin.top + margin.bottom); const g = svg.append("g") .attr('transform', `translate(${margin.left}, ${margin.top})`); g.append("text") .attr("x", visWidth - 340) .attr("y", -margin.top + 95) .attr("font-family", "arial") .attr("font-size", "32px") .text("Days Sales Outstanding"); g.append("text") .attr("x", visWidth - 340) .attr("y", -margin.top + 109) .attr("font-family", "arial") .attr("font-size", "13px") .text("as of their latest annual statements (Dec'22)"); g.append("text") .attr("x", visWidth - 340) .attr("y", -margin.top + 120) .attr("font-family", "arial") .attr("font-size", "9px") .text("*red line marks average DSO for FAANG"); // const y = d3.scaleLinear() // .domain([0, d3.max(dataset, d => d.days_sales_outstanding)]) // .nice() // .range([visHeight, 0]); const y = d3.scaleLinear() .domain([0, 160]) .nice() .range([visHeight, 0]); const xBand = d3.scaleBand() .domain(Array.from(data, d => d.company)) .range([0, visWidth]) .padding(0.2) const x = d3.scalePoint() .domain(Array.from(data, d => d.company)) .range([0, visWidth]) .padding(0.2) const xAxis = d3.axisBottom(x).tickSize(0); xAxis.tickFormat((d,i) => ''); const yAxis = d3.axisLeft(y).tickFormat(d3.format('~s')); const avg_dso_in_new_age = average_of_target_companies(new_age); const avg_dso_in_faang = average_of_target_companies(faang); // bind our data to lines // g.selectAll('line') // .data(dataset) // .join('line') // .attr('x1', d => x(d.companies)) // .attr('x2', d => x(d.companies)) // .attr('y1', d => y(d.days_sales_outstanding)) // .attr('y2', d => visHeight) // .attr('stroke', 'lightgray'); for(const i of data) { // if (i.company == "Paypal" || i.company == "Robinhood") // { // g.append('line') // .attr('x1', x(i.company)) // .attr('x2', x(i.company)) // .attr('y1', y(200)) // .attr('y2', visHeight) // .attr('stroke', 'lightgray'); // } // else // { // g.append('line') // .attr('x1', x(i.company)) // .attr('x2', x(i.company)) // .attr('y1', y(i.dso)) // .attr('y2', visHeight) // .attr('stroke', 'lightgray'); // } if (faang.includes(i.company)) { g.append('line') .attr('x1', x(i.company)) .attr('x2', x(i.company)) .attr('y1', y(i.dso)) .attr('y2', visHeight) .attr('stroke', 'steelblue') .attr('stroke-width', 2); } } // bind our data to circles // g.selectAll('circle') // .data(dataset) // .join('circle') // .attr('cx', d => x(d.companies)) // .attr('cy', d => y(d.days_sales_outstanding)) // .attr('r', 5) // .attr('fill', 'steelblue'); // calculate the mean score const avg_dso = d3.mean(dataset, d => d.days_sales_outstanding); // add a line for the mean g.append('line') .attr('x1', 0) .attr('x2', visWidth) .attr('y1', y(avg_dso_in_faang)) .attr('y2', y(avg_dso_in_faang)) .attr('stroke', 'red') .attr('stroke-width', 1.4); // g.append('line') // .attr('x1', 0) // .attr('x2', visWidth) // .attr('y1', y(avg_dso_in_new_age)) // .attr('y2', y(avg_dso_in_new_age)) // .attr('stroke', 'green'); // add a group for the y-axis g.append('g') .call(yAxis) .call(g => g.selectAll('.tick line') .clone() .attr('stroke', '#d3d3d3') .attr('x1', 0) .attr('x2', visWidth) .attr('opacity', 0.6) ) .append("text") // .attr("x", -margin.left) // .attr("y", cash_scale(0)) .attr("fill", "black") .attr("dominant-baseline", "middle") .attr('transform', 'translate(-45,' + visHeight/2.25 + ') rotate(270)') .attr("text-anchor", "middle") .attr("font-family", "arial") .attr("font-size", 12) .text("Number of Days"); // add a group for the x-axis g.append('g') // we have to move this group down to the bottom of the vis .attr('transform', `translate(0, ${visHeight})`) .call(xAxis); // add a label for the x-axis // .append('text') // .attr('fill', 'black') // .attr('font-family', 'sans-serif') // .attr('x', visWidth / 2) // .attr('y', 40) // .text("Companies"); for(const i of data) { if (i.company in logo_map) { if (i.company == "Paypal" || i.company == "Robinhood") { g.append("image") .attr('x', x(i.company) - 13) .attr('y', y(160) - 19) .attr("xlink:href", await logo_map[i.company].logo_attach.url()) .attr('width', await logo_map[i.company].width) .attr('height', await logo_map[i.company].height); } else { g.append("image") .attr('x', x(i.company) - 13) .attr('y', y(i.dso) - 19) .attr("xlink:href", await logo_map[i.company].logo_attach.url()) .attr('width', await logo_map[i.company].width) .attr('height', await logo_map[i.company].height); } } } g.append("text") .text("(1418 & 531 days [outliers])") .attr("fill", "black") .attr("font-size", 12) .attr("x", x("Paypal") - 40) .attr("y", y(160) + 23); // svg.append("g") // .attr("class", "x axis") // .attr("transform", "translate(0," + visHeight + ")") // .call(xAxis) // .selectAll("text") // .style("text-anchor", "end") // .attr("dx", "-.8em") // .attr("dy", ".15em") // .attr("transform", "rotate(-65)"); return svg.node(); }45:T19fe,async function get_gpm_opm_npm_vis(data, { something = 10 } = {}){ var logo_map = get_logo_map(); function get_average(criteria) { var answer = 0; for (const item of data) { if (faang.includes(item["company"])) {answer+= item[criteria];} } return answer/faang.length; } function get_custom_line_color(c) { if (faang.includes(c)){return "black";} else {return "lightgrey";} } function get_custom_line_width(c) { if (faang.includes(c)){return 2;} else {return 1;} } const margin = {top: 10, bottom: 10, left: 75, right: 20} const visWidth = width - margin.left - margin.right - 200; const visHeight = 400 - margin.top - margin.bottom const svg = d3.create('svg') .attr('width', visWidth + margin.left + margin.right) .attr('height', visHeight + margin.top + margin.bottom); const g = svg.append("g") .attr('transform', `translate(${margin.left}, ${margin.top})`); g.append("text") .attr("x", visWidth - 420) .attr("y", -margin.top + 20) // .attr("text-anchor", "middle") // .attr("dominant-baseline", "hanging") .attr("font-family", "arial") .attr("font-size", "28px") .text("Profit Margins (%) of all companies"); g.append("text") .attr("x", visWidth - 420) .attr("y", -margin.top + 35) // .attr("text-anchor", "middle") // .attr("dominant-baseline", "hanging") .attr("font-family", "arial") .attr("font-size", "11px") .text("as of their latest annual income statements (Dec'22)"); g.append("text") .attr("x", visWidth - 420) .attr("y", -margin.top + 45) .attr("font-family", "arial") .attr("font-size", "9px") .text("*colored horizontal lines mark respective averages for FAANG"); const y = d3.scaleLinear() .domain([-50, 100]) .range([visHeight, 0]) const xBand = d3.scaleBand() .domain(Array.from(data, d => d.company)) .range([0, visWidth]) .padding(0.2) const x = d3.scalePoint() .domain(Array.from(data, d => d.company)) .range([0, visWidth]) .padding(0.2) const xAxis = d3.axisBottom(x).tickFormat((d, i) => '').tickSize(0); const yAxis = d3.axisLeft(y).tickFormat((d, i) => d + '%'); // const avg_gpm_in_new_age = average_of_target_companies(new_age); // const avg_gpm_in_faang = average_of_target_companies(faang); // bind our data to lines g.selectAll('line') .data(data) .join('line') .attr('x1', d => x(d.company)) .attr('x2', d => x(d.company)) .attr('y1', d => y(d.gpm)) .attr('y2', d => visHeight) .attr('stroke', d => get_custom_line_color(d.company)) .attr('stroke-width', d => get_custom_line_width(d.company)); // bind our data to circles // g.selectAll('circle') // .data(dataset) // .join('circle') // .attr('cx', d => x(d.companies)) // .attr('cy', d => y(d.gpm)) // .attr('r', 5) // .attr('fill', 'steelblue'); for(const i of data) { if (!faang.includes(i.company)) { g.append('circle') .attr('cx', d => x(i.company)) .attr('cy', d => y(i.gpm)) .attr('r', 5) .attr('fill', 'steelblue'); if (i.company == "Robinhood" || i.company == "Gitlab") { g.append('circle') .attr('cx', d => x(i.company)) .attr('cy', d => y(-50)) .attr('r', 5) .attr('fill', 'green'); g.append('circle') .attr('cx', d => x(i.company)) .attr('cy', d => y(-50)) .attr('r', 5) .attr('fill', 'red'); } else { g.append('circle') .attr('cx', d => x(i.company)) .attr('cy', d => y(i.opm)) .attr('r', 5) .attr('fill', 'green'); g.append('circle') .attr('cx', d => x(i.company)) .attr('cy', d => y(i.npm)) .attr('r', 5) .attr('fill', 'red'); } } else { g.append('circle') .attr('cx', d => x(i.company)) .attr('cy', d => y(i.gpm)) .attr('r', 5) .attr('fill', 'steelblue'); g.append('circle') .attr('cx', d => x(i.company)) .attr('cy', d => y(i.opm)) .attr('r', 5) .attr('fill', 'green'); g.append('circle') .attr('cx', d => x(i.company)) .attr('cy', d => y(i.npm)) .attr('r', 5) .attr('fill', 'red'); } } g.append('line') .attr('x1', 0) .attr('x2', visWidth) .attr('y1', y(get_average("gpm"))) .attr('y2', y(get_average("gpm"))) .attr('stroke', 'steelblue') .attr('stroke-width', 1.5); g.append('line') .attr('x1', 0) .attr('x2', visWidth) .attr('y1', y(get_average("opm"))) .attr('y2', y(get_average("opm"))) .attr('stroke', 'green') .attr('stroke-width', 1.5); g.append('line') .attr('x1', 0) .attr('x2', visWidth) .attr('y1', y(get_average("npm"))) .attr('y2', y(get_average("npm"))) .attr('stroke', 'red') .attr('stroke-width', 1.5); // add a group for the y-axis g.append('g') .call(yAxis) .append("text") .attr("fill", "black") .attr("dominant-baseline", "middle") .attr('transform', 'translate(-45,' + visHeight/2.5 + ') rotate(270)') .attr("text-anchor", "middle") .text("NPM, GPM, OPM"); // add a group for the x-axis g.append('g') // we have to move this group down to the bottom of the vis .attr('transform', `translate(0, ${visHeight})`) .call(xAxis) // add a label for the x-axis // .append('text') // .attr('fill', 'black') // .attr('font-family', 'sans-serif') // .attr('x', visWidth / 2) // .attr('y', 40) // .text("Companies"); for(const i of data) { g.append("image") .attr('x', x(i.company) - 13) .attr('y', y(i.gpm) - 35) .attr("xlink:href", await logo_map[i.company].logo_attach.url()) .attr('width', await logo_map[i.company].width) .attr('height', await logo_map[i.company].height); } g.append("text") .text("(-90% \u00A0 \u00A0 \u00A0 \u00A0 \u00A0 \u00A0 -51% [OPM outliers])") .attr("fill", "black") .attr("font-size", 12) .attr("x", x("Robinhood")-7) .attr("y", y(-50) - 30); g.append("text") .text("(-203% \u00A0 \u00A0 \u00A0 \u00A0 \u00A0 -61% [NPM outliers])") .attr("fill", "black") .attr("font-size", 12) .attr("x", x("Robinhood")-7) .attr("y", y(-50) - 10); return svg.node(); }46:T1097,function get_r_and_d_by_revenue_vis(data, { something = 10 } = {}){ function average_of_target_companies(target) { var answer = 0; for (const item of data) { if (target.includes(item["company"])) {answer+= item["rd_by_revenue"];} } return answer/target.length; } function custom_color_for_bar(company) { if (faang.includes(company)) { return "#e60049"; } else if (new_age.includes(company)) { return "#0bb4ff"; } else { return "#e6d800"; } } const margin = {top: 30, right: 50, bottom: 20, left: 80}; const visWidth = width - margin.left - margin.right - 400; const visHeight = 600 - margin.top - margin.bottom; const svg = d3.create('svg') .attr('width', visWidth + margin.left + margin.right) .attr('height', visHeight + margin.top + margin.bottom); const g = svg.append("g").attr("transform", `translate(${margin.left}, ${margin.top})`); g.append('g') .attr('transform', `translate(242,300)`) .append(() => Legend(d3.scaleOrdinal(["FAANG", "New Age Start-Ups", "Competitors"], ["#e60049", "#0bb4ff", "#e6d800"]), {})); g.append("text") .attr("x", visWidth-380) .attr("y", visHeight/2) .attr("font-family", "arial") .attr("font-size", 26) .text("Research & Development"); g.append("text") .attr("x", visWidth-380) .attr("y", visHeight/2 + 20) .attr("font-family", "arial") .attr("font-size", 26) .text("Expenditure as a % of Revenue"); g.append("text") .attr("x", visWidth-380) .attr("y", visHeight/2 + 35) .attr("font-family", "arial") .attr("font-size", 11) .text("as of their latest annual income statements (Dec'22)"); g.append("text") .attr("x", visWidth-380) .attr("y", visHeight/2 + 85) .attr("font-family", "arial") .attr("font-size", 9) .text("*red line marks average percentage for FAANG"); const average_rd_by_revenue_in_new_age = average_of_target_companies(new_age); const average_rd_by_revenue_in_faang = average_of_target_companies(faang); const x = d3.scaleLinear() .domain([0, d3.max(data, d => d.rd_by_revenue)]) .range([0, visWidth]); const y = d3.scaleBand() .domain(Array.from(data.sort(function(a, b){return b["rd_by_revenue"] - a["rd_by_revenue"]}), d => d.company)) .range([0, visHeight]) .padding(0.2); const tickLabels = ["0%", "5%", "10%", "15%", "20%", "25%", "30%", "35%", "40%", "45%", "50%", "55%", "60%", "65%", "70%"]; const xAxis = d3.axisBottom(x).tickFormat((d,i) => tickLabels[i]); g.append("g") .attr("transform", `translate(0, ${visHeight})`) .call(xAxis); // .call(g => g.select(".domain").remove()) // .append("text") // .attr("x", visWidth / 2) // .attr("y", 40) // .attr("fill", "black") // .attr("text-anchor", "middle") // .attr("font-size", 20) // .text("R&D Expenditure as a percentage of Revenue"); const yAxis = d3.axisLeft(y); g.append("g") .call(yAxis); // remove baseline from the axis // .call(g => g.select(".domain").remove()) // .append("text") // // .attr("x", -margin.left) // // .attr("y", visHeight / 2) // .attr("fill", "black") // .attr("dominant-baseline", "middle") // .attr('transform', 'translate(-95,' + visHeight/2.5 + ') rotate(270)') // .attr("text-anchor", "middle") // .attr("font-size", 20) // .text("Companies"); // g.append('line') // .attr('x1', x(average_rd_by_revenue_in_new_age)) // .attr('x2', x(average_rd_by_revenue_in_new_age)) // .attr('y1', 0) // .attr('y2', visHeight) // .attr('stroke', 'green'); g.append("g") .selectAll("rect") .data(data) .join("rect") .attr("x", d => 0) .attr("y", d => y(d.company)) .attr("width", d => x(d.rd_by_revenue)) .attr("height", d => y.bandwidth()) .attr("fill", d => custom_color_for_bar(d.company)); g.append('line') .attr('x1', x(average_rd_by_revenue_in_faang)) .attr('x2', x(average_rd_by_revenue_in_faang)) .attr('y1', 0) .attr('y2', visHeight) .attr('stroke', '#e60049'); return svg.node(); }47:[{"id":"bdba5c6f23f49331b407217a7789ca6e8632b43bfde1516e945b180cca93ae93e8f041c85181bfbcc9def8db7dda43b8085c5144d85e5850a1cebd9a4d885d4f","href":"https://static.observableusercontent.com/files/bdba5c6f23f49331b407217a7789ca6e8632b43bfde1516e945b180cca93ae93e8f041c85181bfbcc9def8db7dda43b8085c5144d85e5850a1cebd9a4d885d4f","name":"icons8-facebook-30.png","type":"image/png","lastModified":1671035065923.422,"size":495},{"id":"ecb103d2fae6390c494d4ecae24543fbaa85966a81950811a99785bf56a04f27e1cf82d9611e873f928b6b898052f49d9aff89825e8c1a9e5d48414629871460","href":"https://static.observableusercontent.com/files/ecb103d2fae6390c494d4ecae24543fbaa85966a81950811a99785bf56a04f27e1cf82d9611e873f928b6b898052f49d9aff89825e8c1a9e5d48414629871460","name":"icons8-microsoft-48.png","type":"image/png","lastModified":1671035065923.422,"size":207},{"id":"fc3a2ac58c683036328537fabeed44bd0d04c3342f693f0a2c767badf9c19a724baf6816ba8265f2cc0b57adc73b8641aadbeb2a059561cb846668df52449648","href":"https://static.observableusercontent.com/files/fc3a2ac58c683036328537fabeed44bd0d04c3342f693f0a2c767badf9c19a724baf6816ba8265f2cc0b57adc73b8641aadbeb2a059561cb846668df52449648","name":"icons8-google-48.png","type":"image/png","lastModified":1671035065923.422,"size":1593},{"id":"2b6c1b96c7ac9243d181377b5dc3e6d7839cc1fb524876f85796d8c3c4461b8a221fd5321cb349a82bdf3043940e7d2f028597f1abf4761521a01330db146d14","href":"https://static.observableusercontent.com/files/2b6c1b96c7ac9243d181377b5dc3e6d7839cc1fb524876f85796d8c3c4461b8a221fd5321cb349a82bdf3043940e7d2f028597f1abf4761521a01330db146d14","name":"icons8-apple-logo-30.png","type":"image/png","lastModified":1671035065923.422,"size":465},{"id":"63daca411e15fe101b21ed959fa68c655c367b0b9464e6a29a3938259323fd21654362a9dda0ea0ea03ab61211c1a86ed0f687113e87ecf3e89a1563c61045ec","href":"https://static.observableusercontent.com/files/63daca411e15fe101b21ed959fa68c655c367b0b9464e6a29a3938259323fd21654362a9dda0ea0ea03ab61211c1a86ed0f687113e87ecf3e89a1563c61045ec","name":"icons8-netflix-desktop-app-48.png","type":"image/png","lastModified":1671035065923.422,"size":731},{"id":"8437cdf6a9e4d3601ef08a84dc988030c3ddad257dd97b91900cdf195d9d6435787aa3ac7732eca23acdd32caed987d9cd8bc737907776a20ca93dabf06058ed","href":"https://static.observableusercontent.com/files/8437cdf6a9e4d3601ef08a84dc988030c3ddad257dd97b91900cdf195d9d6435787aa3ac7732eca23acdd32caed987d9cd8bc737907776a20ca93dabf06058ed","name":"icons8-amazon-30.png","type":"image/png","lastModified":1671035065923.422,"size":627},{"id":"fdea3f2b33712e76090b3ac695fc95c5a824f2b6800b7dde187d1f83b0c9ec2b9b1b825b81be0de07089574d4980e0cae63f619b6140dd56f8d3a57fd77678f3","href":"https://static.observableusercontent.com/files/fdea3f2b33712e76090b3ac695fc95c5a824f2b6800b7dde187d1f83b0c9ec2b9b1b825b81be0de07089574d4980e0cae63f619b6140dd56f8d3a57fd77678f3","name":"icons8-tesla-48.png","type":"image/png","lastModified":1671035065923.422,"size":1196},{"id":"921aa806ff4fb3a66ad643dc06ac8603b6d750ad3f0d9acdd2f3d9502edb0dcce07734729070748269de3d1eaf313350f1024148a608709f8ac47af660b5da5f","href":"https://static.observableusercontent.com/files/921aa806ff4fb3a66ad643dc06ac8603b6d750ad3f0d9acdd2f3d9502edb0dcce07734729070748269de3d1eaf313350f1024148a608709f8ac47af660b5da5f","name":"Broadcom-Logo-1991.png","type":"image/png","lastModified":1671035065923.422,"size":21930},{"id":"fdadb886340e1cc22818c08dcd4f08e4cc8f4b394f159728b408334a18565243f6821774023f318462e168f0eb5d49db6b74fa6f4a6f471b3e7629db4e948674","href":"https://static.observableusercontent.com/files/fdadb886340e1cc22818c08dcd4f08e4cc8f4b394f159728b408334a18565243f6821774023f318462e168f0eb5d49db6b74fa6f4a6f471b3e7629db4e948674","name":"icons8-oracle-logo-48.png","type":"image/png","lastModified":1671035065923.422,"size":707},{"id":"00d54a6ebe0f238eff8e1b5b6e6e77cdc367169a2aac5f6705d21afe1c0808433613b8946958e966b47cb93f776349f8685124cecbdca49190d0239a53b3c658","href":"https://static.observableusercontent.com/files/00d54a6ebe0f238eff8e1b5b6e6e77cdc367169a2aac5f6705d21afe1c0808433613b8946958e966b47cb93f776349f8685124cecbdca49190d0239a53b3c658","name":"icons8-starbucks-96.png","type":"image/png","lastModified":1671035065923.422,"size":10717},{"id":"c610abd13bb126ff20a9e3a5a53c39e9da0f4c1333dcaee7652578afaab01626e643359e7e21dc633cbdadff81ebf544be12774913c0e7ac7938c108e55709ed","href":"https://static.observableusercontent.com/files/c610abd13bb126ff20a9e3a5a53c39e9da0f4c1333dcaee7652578afaab01626e643359e7e21dc633cbdadff81ebf544be12774913c0e7ac7938c108e55709ed","name":"icons8-intel-corporation-an-american-multinational-corporation-and-technology-company-96.png","type":"image/png","lastModified":1671035065923.422,"size":4017},{"id":"0aaa41a81aef48cf9011eaf41111a6cb8783b92828090402bfc0c5e04aa2cb4d2919b18d58558d9db0ac947755d5ce7c89a601c38439507bf5338cf738d41bdb","href":"https://static.observableusercontent.com/files/0aaa41a81aef48cf9011eaf41111a6cb8783b92828090402bfc0c5e04aa2cb4d2919b18d58558d9db0ac947755d5ce7c89a601c38439507bf5338cf738d41bdb","name":"Qualcomm-Logo.png","type":"image/png","lastModified":1671035065923.422,"size":12593},{"id":"78e28b1fab8c62c8b2289e4a19fa302c2420f8203f5bf34d9ba000fc791abccaf653808ecde86946d038b80f1b8c8b065281ef1024ad67f29cb645d38b0293e7","href":"https://static.observableusercontent.com/files/78e28b1fab8c62c8b2289e4a19fa302c2420f8203f5bf34d9ba000fc791abccaf653808ecde86946d038b80f1b8c8b065281ef1024ad67f29cb645d38b0293e7","name":"1200px-Intuit_Logo.svg.png","type":"image/png","lastModified":1671035065923.422,"size":12998},{"id":"3e5211aff22a6915be66dd17e3443719bb2cb2095b57c1ffe2f14d08c02036e13f4506f62ce4b64a4eaebd41f7dd631f1c792725c52fa186debb68daaf9d6d74","href":"https://static.observableusercontent.com/files/3e5211aff22a6915be66dd17e3443719bb2cb2095b57c1ffe2f14d08c02036e13f4506f62ce4b64a4eaebd41f7dd631f1c792725c52fa186debb68daaf9d6d74","name":"Coursera-Logo.png","type":"image/png","lastModified":1671035065923.422,"size":32133},{"id":"36762dd1605bcfa2d2c7fee08068c718677f80a432b6991505cce25af39d0569c410343e8ec569f7a2d7d576c48eb87a19c6d5143eb34f4142df2d7d7c707103","href":"https://static.observableusercontent.com/files/36762dd1605bcfa2d2c7fee08068c718677f80a432b6991505cce25af39d0569c410343e8ec569f7a2d7d576c48eb87a19c6d5143eb34f4142df2d7d7c707103","name":"Gitlab-Logo.png","type":"image/png","lastModified":1671035065923.422,"size":34562},{"id":"a196f643c6a9075eb47f66f15b3aaebe17a7cc70cec0d9ada25d7902e9ba850b6df1b2356b5fb0c50e7dccbae26ced619fc869ea698a25d312cf89639708ffd9","href":"https://static.observableusercontent.com/files/a196f643c6a9075eb47f66f15b3aaebe17a7cc70cec0d9ada25d7902e9ba850b6df1b2356b5fb0c50e7dccbae26ced619fc869ea698a25d312cf89639708ffd9","name":"Robinhood-logo.png","type":"image/png","lastModified":1671035065923.422,"size":21467},{"id":"827a6e2c62dedf25baff721a15c1092f4a9190f156460791d0d98c060de919ab8e892ded58f2a68d0e8591749e5c393e8f3a84743a4614dd7a133264fd01844f","href":"https://static.observableusercontent.com/files/827a6e2c62dedf25baff721a15c1092f4a9190f156460791d0d98c060de919ab8e892ded58f2a68d0e8591749e5c393e8f3a84743a4614dd7a133264fd01844f","name":"icons8-nvidia-48.png","type":"image/png","lastModified":1671035065923.422,"size":2091},{"id":"5caa8e9902af5d7902816fcadc60cf18228dc9eaa356f286dc127c473ad75cae510e03780d5e1e4be611118adf23353ef48ff6390d56fbe26b8edb5a29097a54","href":"https://static.observableusercontent.com/files/5caa8e9902af5d7902816fcadc60cf18228dc9eaa356f286dc127c473ad75cae510e03780d5e1e4be611118adf23353ef48ff6390d56fbe26b8edb5a29097a54","name":"icons8-bumble-64.png","type":"image/png","lastModified":1671035065923.422,"size":2715},{"id":"e5f968de640522e472afbc67ce9f167e81882e8667162cd4cf144d33de7af10f960f2fb6667fdb60bac98e2a11b4fbb0c5f717a790e7f0573527ea4c2b7e710f","href":"https://static.observableusercontent.com/files/e5f968de640522e472afbc67ce9f167e81882e8667162cd4cf144d33de7af10f960f2fb6667fdb60bac98e2a11b4fbb0c5f717a790e7f0573527ea4c2b7e710f","name":"icons8-salesforce-48.png","type":"image/png","lastModified":1671035065923.422,"size":1425},{"id":"15bd69e3bbb7227aff33fb3881e49e76c19516ec3da4234b74d53e792f6e532451c58aa28f22854d0a9add1cb2edca7a83057a4a7f06b706ec5f572c1f1d3550","href":"https://static.observableusercontent.com/files/15bd69e3bbb7227aff33fb3881e49e76c19516ec3da4234b74d53e792f6e532451c58aa28f22854d0a9add1cb2edca7a83057a4a7f06b706ec5f572c1f1d3550","name":"cisco-emblem.jpeg","type":"image/jpeg","lastModified":1671035065923.422,"size":41713},{"id":"fd1f29326442c63052c10031d8d6f3f4daee43dd947c14b201baad908e4a57fc716061a63dd680d0d1ed5b9a18e997642e205a1c0a46f2460d2a8dd7e99dca83","href":"https://static.observableusercontent.com/files/fd1f29326442c63052c10031d8d6f3f4daee43dd947c14b201baad908e4a57fc716061a63dd680d0d1ed5b9a18e997642e205a1c0a46f2460d2a8dd7e99dca83","name":"icons8-paypal-48.png","type":"image/png","lastModified":1671035065923.422,"size":1098},{"id":"1ce881f9eefb75d59c61b7c57d1bd78910756a561653c9a436e001a2336ef5279ce491d5a194e4ed3b90de3ea582007b4a616cb0a04ea5e6caa4adee9d947d75","href":"https://static.observableusercontent.com/files/1ce881f9eefb75d59c61b7c57d1bd78910756a561653c9a436e001a2336ef5279ce491d5a194e4ed3b90de3ea582007b4a616cb0a04ea5e6caa4adee9d947d75","name":"Coinbase-logo.png","type":"image/png","lastModified":1671035065923.422,"size":17198},{"id":"9e23ef46b48b560dc5f360ed970eab82487d18d52ffdfd2f7a42aadb756df67640702875cbfcabb941277ccd9b7e2e16c0e4ecdc1361eba807b3cd69bb403471","href":"https://static.observableusercontent.com/files/9e23ef46b48b560dc5f360ed970eab82487d18d52ffdfd2f7a42aadb756df67640702875cbfcabb941277ccd9b7e2e16c0e4ecdc1361eba807b3cd69bb403471","name":"icons8-uber-48.png","type":"image/png","lastModified":1671035065923.422,"size":690},{"id":"d901bd4449c12387ee111b9878539e5fc262574b5e95566d0d05674cc11a1c027969b7c5f92400c23bcac1ab7c137aab2af06a6ad8ee358805f5576abeee4d79","href":"https://static.observableusercontent.com/files/d901bd4449c12387ee111b9878539e5fc262574b5e95566d0d05674cc11a1c027969b7c5f92400c23bcac1ab7c137aab2af06a6ad8ee358805f5576abeee4d79","name":"Costco-logo.png","type":"image/png","lastModified":1671035065923.422,"size":36274},{"id":"ad6c5bdeb81ef6b1e4e7fcf282006cb72588eb2ab9360519d0ed88e50a6f85f412e1889d81261d507acaeb94fab1ec1f5666e8bc4de962fa1a965f0276d2d845","href":"https://static.observableusercontent.com/files/ad6c5bdeb81ef6b1e4e7fcf282006cb72588eb2ab9360519d0ed88e50a6f85f412e1889d81261d507acaeb94fab1ec1f5666e8bc4de962fa1a965f0276d2d845","name":"icons8-adobe-64.png","type":"image/png","lastModified":1671035065923.422,"size":2030},{"id":"117f8495630603fac1982a043d8e0c5cec4f3c02eeb899acb88333c7abbd3c774ff1b64b7e3860879da5f7f1f7a6edb4fb197b41fed2d28d43a8cfd5f7c32dcc","href":"https://static.observableusercontent.com/files/117f8495630603fac1982a043d8e0c5cec4f3c02eeb899acb88333c7abbd3c774ff1b64b7e3860879da5f7f1f7a6edb4fb197b41fed2d28d43a8cfd5f7c32dcc","name":"data_for_final_project@4.json","type":"application/json","lastModified":1671035065923.422,"size":12203}] 30:{"id":"246953fb8a2809eb","slug":"project-artibeus-final-submission","title":"\"To FAANG or NOT to FAANG, that is the question.\"","thumbnail":"2ff1f532eb7a19b8f67d328dbd2c98b40a2208baf4e87ce3b9a8feef68988b0e","access_level":"public","create_time":"$D2022-12-14T16:24:25.923Z","update_time":"$D2023-04-30T18:03:11.440Z","view_time":null,"first_public_time":"$D2022-12-14T16:24:25.923Z","has_unpublished_edits":null,"fork":{"id":"7799dca32358eba7","slug":"project-artibeus-final-personal","title":"Project Artibeus - Second Draft - \"To FAANG or NOT to FAANG, that is the question.\"","owner":{"id":"affcf8132445ebb8","login":"sonaliketaki","name":"Sonali Singh"}},"stars":0,"starred":false,"owner":{"type":"team","id":"b896c378abf327fc","login":"raghavsikaria","name":"the_piranha","avatar_url":"https://avatars-next.observableusercontent.com/afe8ab37d5536ecbd580eda52a21debe2382f861cc40a11de2320e7ac97a9917","tier":"starter_2024","bio":""},"version":1980,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"41101e71bed19391","login":"raghavsikaria","name":"the_piranha","avatar_url":"https://avatars-next.observableusercontent.com/afe8ab37d5536ecbd580eda52a21debe2382f861cc40a11de2320e7ac97a9917","tier":null,"bio":""}],"members":[{"type":"individual","id":"41101e71bed19391","login":"raghavsikaria","name":"the_piranha","avatar_url":"https://avatars-next.observableusercontent.com/afe8ab37d5536ecbd580eda52a21debe2382f861cc40a11de2320e7ac97a9917","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"\"To FAANG or NOT to FAANG, that is the question.\"","cells":[{"id":744,"value":"$32","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":854,"value":"**Let's** start by having a look at the share prices of these companies [as of 1st December 2022]","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":856,"value":"get_share_price_vis(\n dataset.map(d => ({company: d.companies, share_price: d.share_price} ))\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":859,"value":"$33","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":869,"value":"get_market_cap_vis(\n dataset.map(d => ({company: d.companies, market_cap: d.market_cap} ))\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":873,"value":"$34","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":879,"value":"get_revenue_vs_netprofit_vis(\n dataset.map(d => ({company: d.companies, revenue: d.revenue, net_profit: d.net_profit} )).sort(function(a, b){return b[\"revenue\"] - a[\"revenue\"]})\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":886,"value":"$35","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":899,"value":"get_number_of_employees_vis(\n dataset.map(d => ({company: d.companies,number_of_employees: d.number_of_employees} ))\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1974,"value":"dataset.map(d => ({company: d.companies,number_of_employees: d.number_of_employees} ))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":902,"value":"This is a straightforward metric. What does not come as a surprise is the top 3 companies by this metric are Amazon, Starbucks, and Costco. Any reasons for this? Guesses? Well, they are all operations heavy companies! And the average number of employees for FAANG is heavily skewed by Amazon alone.\n\n2 interesting observations though:\n+ Netflix really has _quite_ a small number of employees as compared to the other FAANG members\n+ All new-age companies have consistently the least number of employees and all rank last next to each other\n\nThe latter is rather basic since they've started operations recently and in these initial stages the number of employees is low, but with a high year-on-year rate of increase. It is quite saddening that even the well-established FAANG and other giants have been conducting mass layoffs recently.\n\n**NOTE:** These numbers as per their latest annual reports (and don't account for the recent mass layoffs)\n\n**Let's** now look at the assets of these companies:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":910,"value":"get_cash_and_liabilities_vis(\n dataset.map(d => ({company: d.companies, cash: d.cash_on_hand, total_liabilities: d.total_liabilities, net_cash: d.cash_on_hand - d.total_liabilities} )).sort(function(a, b){return b[\"cash\"] - a[\"cash\"]})\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":913,"value":"$36","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":995,"value":"get_current_vs_quick_ratio_vis(\n dataset.map(d => ({company: d.companies, quick_ratio: d.quick_ratio, current_ratio: d.current_ratio} )).sort(function(a, b){return b[\"quick_ratio\"] - a[\"quick_ratio\"]})\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":919,"value":"$37","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":987,"value":"get_netprofit_vs_revenue_per_employee_vis(\n dataset.map(d => ({company: d.companies, revenue_per_employee: d.revenue_per_employee, net_profit_per_employee: d.net_profit_per_employee} )).sort(function(a, b){return b[\"revenue_per_employee\"] - a[\"revenue_per_employee\"]})\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":928,"value":"And, the prodigal son, Netflix returns. What a comeback! It has the maximum revenue/employee among all the companies. And a net profit/employee number at par with its FAANG brethren. Microsoft is the laggard this time (and that too in both metrics) bringing down the average. Coinbase and Cisco are the underdogs with Coinbase actually bearing the maximum net profit/employee amount by a huge margin. Gitlab and Coursera are loss-making companies, which is fine because that is expected of them being in the early stage. FAANG dominates this space, which again is fitting of them since they are expected to have optimized all of their costs and have achieved economies of scale.\n\n**Let's** look at a lesser-known albeit super-interesting metric - Days Sales Outstanding:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":983,"value":"get_dso_vis(\n dataset.map(d => ({company: d.companies, dso: d.days_sales_outstanding})).sort(function(a, b){return b[\"dso\"] - a[\"dso\"]})\n )","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":934,"value":"$38","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1905,"value":"Swatches(d3.scaleOrdinal([\"Gross Profit Margin\", \"Operating Profit Margin\", \"Net Profit Margin\"], [\"steelblue\", \"green\", \"red\"]), {})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":971,"value":"get_gpm_opm_npm_vis(\n dataset.map(d => ({company: d.companies, gpm: d.gpm, opm: d.opm, npm: d.npm})).sort(function(a, b){return b[\"gpm\"] - a[\"gpm\"]})\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":940,"value":"$39","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":954,"value":"get_r_d_vis(\n dataset.map(d => ({company: d.companies, r_d: d.r_and_d} ))\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":945,"value":"These are absolute numbers. And, FAANG minus Netflix plus Microsoft are clear winners. Though the least of FAANG minus Netflix squad, Microsoft still has a R&D Expenditure at par with Apple & Meta. Intel, Qualcomm and Oracle have made their presence felt with good R&D spends. FAANG has won this round again. One could argue that we are not looking at the percentage of revenue that the companies spent on their R&D. Well **let's** look into that too:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":964,"value":"get_r_and_d_by_revenue_vis(\n dataset.map(d => ({company: d.companies,rd_by_revenue: d.rd_by_revenue} ))\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":947,"value":"$3a","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":891,"value":"## Conclusion\n\nThere are important and credible metrics where FAANG does not stand out and fails to outshine its competitors, like Profit Margins, Days Sales Outstanding, Current Ratio & Quick Ratio, and even scale metrics like market capitalization. However, this in no way is an exhaustive or correct approach to conclude this. On the other hand, it does tell that there surely are companies competing with FAANG, some even at par and we have some factual evidence, that no, FAANG is really not _all_ that is out there.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":756,"value":"## References\n\nWe would like to extend our heartiest gratitude to our Information Visualization Professor at NYU, Dr. Claudio Silva, and the wonderful TAs Jun and Juan for guiding us throughout this project, and for helping kill the bugs which had once stained the canvas of these visualizations.\n\n+ All company's logos and icons from: https://icons8.com/\n+ All financial data from: https://www.macrotrends.net/ and respective annual statements\n\n## Visualization Specifics & Appendix\n\n#### Data for the project:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":108,"value":"dataset = FileAttachment(\"data_for_final_project@4.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":244,"value":"faang = [\"Facebook/Meta\", \"Apple\", \"Amazon\", \"Netflix\", \"Alphabet\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":246,"value":"new_age = [\"Bumble\", \"Coursera\", \"Robinhood\", \"Gitlab\", \"Coinbase\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":979,"value":"companies = dataset.map(d => d.companies)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":776,"value":"##### To retrieve LOGO File Attachment for each of the 25 companies","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":718,"value":"$3b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1213,"value":"get_logo_map()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":779,"value":"##### Data Sanity Check","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":110,"value":"viewof table = Inputs.table(dataset)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1751,"value":"import {Legend, Swatches} from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":781,"value":"#### Visualization functions - scale of companies","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1922,"value":"$3c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1926,"value":"$3d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1930,"value":"$3e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1934,"value":"$3f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1938,"value":"$40","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1958,"value":"$41","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":958,"value":"#### Visualization functions - normalized metrics","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1942,"value":"$42","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1946,"value":"$43","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1950,"value":"$44","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1954,"value":"$45","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1962,"value":"$46","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W47","stdlib":"1"}} 31:"$30:body"