2c:null 2d:["$","title",null,{"children":"Diferença de idade entre casais de filmes de Hollywood v2 | arinaldofms | Observable"}] 32:T926,md`# Diferença de idade entre casais de filmes de Hollywood v2 Este notebook apresenta uma breve análise da diferença de idade entre membros de um casal de filmes de Hollywood. Para isso, foi utilizada uma versão alterada dos dados originais do projeto de @lynnandtonic (no twitter) que analisa a diferença de idade entre as partes de pares românticos nos filmes de Hollywood. A análise original dela está em http://hollywoodagegap.com/, e os dados e código estão gentilmente disponíveis em https://github.com/lynnandtonic/hollywood-age-gap . Já os dados alterados que são utilizados neste notebook estão disponíveis em https://raw.githubusercontent.com/cienciadedados-ufcg/eda-pares-romanticos/master/data/hollywoodagegaps.csv. Cada item dos dados representa um casal de um filme, podendo o mesmo filme ter mais de um casal, o que neste caso é apresentado como um novo item nos dados. Abaixo estão os atributos disponíveis no conjunto de dados em análise: * movie_name: nome do filme; * release_year: ano de lançamento do filme; * director: nome do(a) diretor(a) do filme; * age_difference: diferença de idade entre o ator/atriz 1 e o ator/atriz 2; * actor_1_name: nome do ator/atriz 1; * actor_1_gender: gênero do ator/atriz 1; * actor_1_birthdate: data de nascimento do ator/atriz 1; * actor_1_age: idade do ator/atriz 1; * actor_2_name: nome do ator/atriz 2; * actor_2_gender: gênero do ator/atriz 2; * actor_2_birthdate: data de nascimento do ator/atriz 2; * actor_2_age: idade do ator/atriz 2; * same_sex: TRUE se o casal é do mesmo sexo, FALSE caso contrário; Nesta análise serão utilizados apenas os dados referentes ao ano de lançamento do filme e a diferença de idade entre os membros do casal em módulo. Ressalta-se que os dados não contemplam todos os filmes de Hollywood, contemplando apenas uma parcela destes, os quais foram utilizados pela autora original em seu trabalho. É possível que algum par romântico esteja presente nos dados aqui analisados e não esteja presente no site da autora, devido a maneira colaborativa de inserção de pares românticos descrito no GitHub da autora. Além disso, nesta análise, não será feita a distinção entre idade de casais de mesmo sexo ou de sexo opostos, onde todos os casais presentes nos dados serão contemplados como um todo.` 33:T54a,chart_line = { const tooltip = new Tooltip(); const vis2 = d3.create("svg") .attr("viewBox", [0, 0, width, height]); //media vis2.append("path") .datum(dadosPorDecada) .attr("fill", "none") .attr("stroke", "darkblue") .attr("stroke-width", 1.5) .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("d", line); vis2.selectAll("circle") .data(dadosPorDecada) .join("circle") .attr("cx", d => x2(d.decada)) .attr("cy", d => y2(d.media_dif_idade)) .attr("r", 2) .attr("fill", "darkblue") vis2.append("g") .call(xAxis2) .call(xLabel2); vis2.append("g") .call(yAxis2) .call(yLabel2); vis2.append("g") .attr("fill", "none") .attr("pointer-events", "all") .selectAll("rect") .data(d3.pairs(dadosPorDecada)) .join("rect") .attr("x", ([a, b]) => x2(a.decada)) .attr("height", height) .attr("width", ([a, b]) => x2(b.decada) - x2(a.decada)) // .on("mouseover", (event, [a]) => tooltip.show(a)) // .on("mouseout", () => tooltip.hide()); .on("mousemove", event => tooltip.show(bisect(dadosPorDecada, x2.invert(event.offsetX)))) .on("mouseleave", () => tooltip.hide()); vis2.append(() => tooltip.node); return vis2.node(); }34:T567,chart_line_mediana = { const tooltip2 = new Tooltip2(); const vis3 = d3.create("svg") .attr("viewBox", [0, 0, width, height]); //mediana vis3.append("path") .datum(dadosPorDecada) .attr("fill", "none") .attr("stroke", "darkgreen") .attr("stroke-width", 1.5) .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("d", line_mediana); vis3.selectAll("circle") .data(dadosPorDecada) .join("circle") .attr("cx", d => x2(d.decada)) .attr("cy", d => y2(d.mediana_dif_idade)) .attr("r", 2) .attr("fill", "darkgreen") vis3.append("g") .call(xAxis2) .call(xLabel2); vis3.append("g") .call(yAxis2) .call(yLabel3); vis3.append("g") .attr("fill", "none") .attr("pointer-events", "all") .selectAll("rect") .data(d3.pairs(dadosPorDecada)) .join("rect") .attr("x", ([a, b]) => x2(a.decada)) .attr("height", height) .attr("width", ([a, b]) => x2(b.decada) - x2(a.decada)) // .on("mouseover", (event, [a]) => tooltip.show(a)) // .on("mouseout", () => tooltip.hide()); .on("mousemove", event => tooltip2.show(bisect(dadosPorDecada, x2.invert(event.offsetX)))) .on("mouseleave", () => tooltip2.hide()); vis3.append(() => tooltip2.node); return vis3.node(); }35:T55e,md`Os gráficos de linhas acima apresentam a média, em azul escuro, e mediana, em verde escuro, da diferença de idade entre os membros de um casal em módulo ao longo das décadas. Para o cálculo das referidas estatísticas foi usada a operação matemática de módulo pois nos dados haviam valores negativos desta diferença, o que indica que o ator/atriz 2, tipicamente mulher quando o casal é de sexos opostos, é mais velho(a) que o(a) ator/atriz 1. Em ambos os gráficos é possível observar uma tendência de baixa, a partir da década de 1970, indicando uma provável diminuição da diferença entre as idades de um casal ao longo do tempo. Também é possível observar duas décadas atípicas, as de 1940 e de 1960. Na de 1940 temos as maiores médias e medianas da diferença de idade, aproximandamente 25 (vinte e cinco) anos em ambas. Talves isso tenha relação com poucos dados referentes a esta década, onde os dados podem conter algum valor extremo. Já para a década de 1960, observa-se que ela apresentou a menor média e a menor mediana da diferença de idade, com aproximadamente 9 (nove) e 7 (sete) anos de diferença, respectivamente. Todavia, não se pode afirmar, apenas pela média e mediana da diferença de idade, que esta diferença vem caindo com o passar dos anos, onde uma análise estatística mais refinada se faz necessária.`36:[] 30:{"id":"14f9674cb8f31fcd","slug":"diferenca-de-idade-entre-casais-de-filmes-de-hollywood-v2","title":"Diferença de idade entre casais de filmes de Hollywood v2","thumbnail":"d400e419448b118df99f8d525496d4633a83f854ea6c298179a83f1b7a964c19","access_level":"public","create_time":"$D2020-10-05T01:13:07.312Z","update_time":"$D2020-10-05T02:51:28.278Z","view_time":null,"first_public_time":"$D2020-10-05T02:51:47.128Z","fork":{"id":"b0969f8049dd2c69","slug":"diferenca-de-idade-entre-casais-de-filmes-de-hollywood","title":"Diferença de idade entre casais de filmes de Hollywood","owner":{"id":"ecd0a43acfa7bb66","login":"arinaldofms","name":""}},"stars":1,"starred":false,"owner":{"type":"team","id":"ecd0a43acfa7bb66","login":"arinaldofms","name":"","avatar_url":"https://avatars-next.observableusercontent.com/71fc4f8b165e5bb3bbba07233ca3cc6f1d4824f9b4a12a9ebcbbb5cc98e5c5e5","tier":"starter_2024"},"version":538,"publish_version":538,"role":null,"authored":false,"authors":[{"type":"individual","id":"d69d38c5c0001100","login":"arinaldofms","name":"","avatar_url":"https://avatars-next.observableusercontent.com/71fc4f8b165e5bb3bbba07233ca3cc6f1d4824f9b4a12a9ebcbbb5cc98e5c5e5","tier":null}],"members":[{"type":"individual","id":"d69d38c5c0001100","login":"arinaldofms","name":"","avatar_url":"https://avatars-next.observableusercontent.com/71fc4f8b165e5bb3bbba07233ca3cc6f1d4824f9b4a12a9ebcbbb5cc98e5c5e5","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Diferença de idade entre casais de filmes de Hollywood v2","cells":[{"id":0,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":5,"value":"chart = {\n const svg = d3.create(\"svg\")\n .attr(\"viewBox\", [0, 0, width, height]);\n \n svg.selectAll('rect')\n .data(dadosPorDecada)\n .join('rect')\n .attr(\"x\", x(0))\n .attr(\"y\", d => y(d.decada))\n .attr(\"width\", d => x(d.quantidade_pares) - x(0))\n .attr(\"height\", 55)\n .attr(\"opacity\", 0.5)\n .attr(\"fill\", \"darkgreen\")\n \n\n svg.append(\"g\")\n .call(xAxis)\n .call(xLabel);\n\n svg.append(\"g\")\n .call(yAxis)\n .call(yLabel);\n\n\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":358,"value":"md`Inicialmente, os dados foram agrupados pela década onde a quantidade de pares românticos, a média e mediana da diferença de idade entre os membros do casal foram calculados. \nNo gráfico em barras horizontais acima, observa-se a quantidade de pares românticos por década. A década com menor quantidade de casais é a de 1940 com 3 (três) casais e a com maior é a de 2000 com 369 casais. É possível observar um aumento do número de casais nos dados com o passar das décadas, com exceção da década de 2010. Isso pode ter relação com os dados apresentarem casais apenas de filmes lançados até meados de 2018, assim como a escassez de mídias digitais e/ou interesse por filmes mais antigos.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":11,"value":"x = d3.scaleLinear()\n .domain([0, d3.max(dadosPorDecada, d => d.quantidade_pares)])\n .range([margin.left, width - margin.right])\n .nice()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":15,"value":"// y = d3.scaleLinear()\n// .domain(d3.extent(dadosPorDecada, d => d.decada))\n// .range([height - margin.bottom, margin.top])\n// .nice()\ny = d3.scaleBand()\n .domain(dadosPorDecada.map(d => d.decada))\n .range([height - margin.bottom, margin.top])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":17,"value":"xAxis = g => g\n .attr(\"transform\", `translate(0,${height - margin.bottom})`)\n .call(d3.axisBottom(x))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":261,"value":"xLabel = g => g\n .select(\".tick:last-of-type text\")\n .clone()\n .attr(\"text-anchor\", \"end\")\n .attr(\"x\", -360)\n .attr(\"y\", 20)\n .attr(\"font-weight\", \"bold\") \n .text(\"Quantidade de pares românticos\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":19,"value":"yAxis = g => g\n .attr(\"transform\", `translate(${margin.left},0)`)\n .call(d3.axisLeft(y))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":265,"value":"yLabel = g => g\n .select(\".tick:last-of-type text\")\n .clone()\n .attr(\"transform\", \"rotate(-90)\")\n .attr(\"x\", -180)\n .attr(\"y\", -35)\n .attr(\"font-weight\", \"bold\")\n .text(\"Década\")\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":158,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":476,"value":"bisect = {\n const bisectDate = d3.bisector(d => d.decada).left;\n return (data, decada) => {\n const i = bisectDate(data, decada, 1);\n const a = data[i - 1], b = data[i];\n return decada - a.decada > b.decada - decada ? b : a;\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":160,"value":"line = d3.line()\n .defined(d => !isNaN(d.media_dif_idade))\n .x(d => x2(d.decada))\n .y(d => y2(d.media_dif_idade))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":165,"value":"x2 = d3.scaleLinear()\n .domain(d3.extent(dadosPorDecada, d => d.decada))\n .range([margin.left, width - margin.right])\n\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":167,"value":"y2 = d3.scaleLinear()\n .domain([0, d3.max(dadosPorDecada, d => d.media_dif_idade)])\n .range([height - margin.bottom, margin.top])\n .nice()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":163,"value":"xAxis2 = g => g\n .attr(\"transform\", `translate(0,${height - margin.bottom})`)\n .call(d3.axisBottom(x2).ticks(9).tickSizeOuter(0))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":299,"value":"xLabel2 = g => g\n .select(\".tick:last-of-type text\")\n .clone()\n .attr(\"text-anchor\", \"end\")\n .attr(\"x\", -420)\n .attr(\"y\", 20)\n .attr(\"font-weight\", \"bold\") \n .text(\"Década\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":169,"value":"yAxis2 = g => g\n .attr('class', 'y axis')\n .attr(\"transform\", `translate(${margin.left},0)`)\n .call(d3.axisLeft(y2))\n .call(g => g.select(\".domain\").remove())\n .call(g => g.select(\".tick:last-of-type text\").clone()\n .attr(\"x\", 3)\n .attr(\"text-anchor\", \"start\")\n .attr(\"font-weight\", \"bold\")\n .text(dadosPorDecada.y2))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":303,"value":"yLabel2 = g => g\n .select(\".tick:last-of-type text\")\n .clone()\n .attr(\"transform\", \"rotate(-90)\")\n .attr(\"x\", -95)\n .attr(\"y\", -35)\n .attr(\"font-weight\", \"bold\")\n .text(\"Média da diferença de idade entre o casal (em módulo)\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":375,"value":"$34","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":373,"value":"line_mediana = d3.line()\n .defined(d => !isNaN(d.mediana_dif_idade))\n .x(d => x2(d.decada))\n .y(d => y2(d.mediana_dif_idade))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":386,"value":"yLabel3 = g => g\n .select(\".tick:last-of-type text\")\n .clone()\n .attr(\"transform\", \"rotate(-90)\")\n .attr(\"x\", -95)\n .attr(\"y\", -35)\n .attr(\"font-weight\", \"bold\")\n .text(\"Mediana da diferença de idade entre o casal (em módulo)\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":392,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":412,"value":"class Tooltip {\n constructor() {\n this._decada = svg``;\n this._media_dif_idade = svg``;\n this.node = svg`\n \n ${this._media_dif_idade}\n \n`;\n }\n show(d) {\n this.node.removeAttribute(\"display\");\n this.node.setAttribute(\"transform\", `translate(${x2(d.decada)},${y2(d.media_dif_idade)})`);\n this._decada.textContent = d.decada;\n this._media_dif_idade.textContent = formatValor(d.media_dif_idade);\n }\n hide() {\n this.node.setAttribute(\"display\", \"none\");\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":521,"value":"class Tooltip2 {\n constructor() {\n this._decada = svg``;\n this._mediana_dif_idade = svg``;\n this.node = svg`\n \n ${this._mediana_dif_idade}\n \n`;\n }\n show(d) {\n this.node.removeAttribute(\"display\");\n this.node.setAttribute(\"transform\", `translate(${x2(d.decada)},${y2(d.mediana_dif_idade)})`);\n this._decada.textContent = d.decada;\n this._mediana_dif_idade.textContent = formatValor(d.mediana_dif_idade);\n }\n hide() {\n this.node.setAttribute(\"display\", \"none\");\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":415,"value":"formatDecada = d3.utcFormat(\"%b %-d, ’%y\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":418,"value":"formatValor = d3.format(\".2f\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":12,"value":"margin = ({top: 20, right: 30, bottom: 30, left: 40})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":6,"value":"height = 500","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8,"value":"d3 = require(\"d3@6\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":43,"value":"dados = (await d3.csv(\"https://raw.githubusercontent.com/cienciadedados-ufcg/eda-pares-romanticos/master/data/hollywoodagegaps.csv\", d3.autoType)).sort((a,b) => (a.release_year > b.release_year) ? 1 : ((b.release_year > a.release_year) ? -1 : 0)); ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":58,"value":"function calculaMetricasPorDecada(decada) {\n let temp = dados.filter(d => d.release_year >= decada && d.release_year < decada + 10);\n // console.log(temp)\n let quantidade_pares = temp.length;\n let media_dif_idade = d3.mean(temp, d => Math.abs(d.age_difference));\n let mediana_dif_idade = d3.median(temp, d => Math.abs(d.age_difference));\n return {\n \"decada\":decada,\n \"quantidade_pares\":quantidade_pares,\n \"media_dif_idade\":media_dif_idade,\n \"mediana_dif_idade\":mediana_dif_idade\n };;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":81,"value":"dadosPorDecada = Array.prototype.concat(\n\tcalculaMetricasPorDecada(1940),\n\tcalculaMetricasPorDecada(1950),\n\tcalculaMetricasPorDecada(1960),\n\tcalculaMetricasPorDecada(1970),\n\tcalculaMetricasPorDecada(1980),\n\tcalculaMetricasPorDecada(1990),\n\tcalculaMetricasPorDecada(2000),\n\tcalculaMetricasPorDecada(2010))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W36","stdlib":"1","titling":"auto"}} 31:"$30:body"