Published
Edited
Dec 6, 2019
md`# VISUALIZANDO REDES - LAB 4`
md`#### #DeathStranding`
md`Em 8 de novembro de 2019, Hideo Kojima lançou seu primeiro jogo após a sua saída da konami. O tão aguardado Death Stranding logo explodiu no twitter gerando uma avalanche de tweets na rede social, com diversos reviews positivos.
<figure>
<img src="${await FileAttachment("giphy@1.gif").url()}">
</figure>`
md`Para uma investigação mais detalhada dessas interações no twitter, será feita uma análise com dados coletados a partir do plugin 'Twitter Streaming importer', no dia 05/12/2019, sobre as interações que ocorreram na rede social por intermédio da hashtag DeathStranding. A Figura abaixo apresenta uma rede conectada de nós, onde cada um representa um autor de alguma publicação no Twiter utilizando a hashtag.
Obs: foram deixados apenas os componentes com a maioria dos nós (acima de 1)`
chart = {
const svg = d3.create("svg").attr("viewBox", [0, 0, 1200, 800]);
const g = svg.append("g");
g.append("image").attr(
"xlink:href",
await toDataURL(
'https://gist.githubusercontent.com/erickrdgs/f04c0625817a4454450a73a06bdb7e58/raw/3d87799b4f94ff8eebdefaa4fccac4f6ff713a32/DeathStranding.svg?sanitize=true'
)
);
svg.call(
d3
.zoom()
.extent([[0, 0], [1200, 800]])
.scaleExtent([1, 8])
.on("zoom", zoomed)
);
function zoomed() {
g.attr("transform", d3.event.transform);
}
return svg.node();
}
md`No grafo é possível observar a presença de 3 grandes grupos, nos quais 2 possuem como nós de maior influência, as duas contas do criador do game. O tamanho de cada nó é definido pelo número de retweets e menções que da conta. Podemos concluir que grande parte das interações com a hashtag vem do seu próprio criador (Hideo Kojima) e algumas outras da conta [@notfabricio](https://twitter.com/NotFabricio).`
md`#### n° de seguidores`
embed({
$schema: "https://vega.github.io/schema/vega-lite/v4.json",
data: {
url:
"https://gist.githubusercontent.com/erickrdgs/a17e4207c40d09dcd10a5edc85ce82ed/raw/d419004fd7ba900fd458af07dd939dd003be173f/kojima2.csv"
},
title: "Top 5 perfis",
width: 250,
height: 250,
mark: "bar",
encoding: {
y: {
field: "followers_count",
type: "quantitative",
title: "Seguidores"
},
x: {
field: "Label",
type: "nominal",
title: "Twitter",
sort: "x"
},
color: {
field: "Label",
type: "nominal",
title: "Twitter"
}
}
})
md`No gráfico de barra, podemos ver que mesmo tendo o maior número de seguidores, a conta [@hideo_kojima_en](https://twitter.com/HIDEO_KOJIMA_EN) não foi a que teve o maior número de retweets e menções da nossa rede.`
md`#### #BlackFriday2019`
md`Em 29 novembro de 2019 outro grande evento ocorreu na internet, a Black Friday, a última sexta-feira do mês marcada por grandes promoções e descontos em diversos segmentos do mercado. O que acabou gerando um certo alvoroço entre os usuários das redes sociais.
<figure>
<img src="${await FileAttachment("tenor.gif").url()}">
</figure>`
chartBlack = {
const svg = d3.create("svg").attr("viewBox", [0, 0, 1200, 800]);
const g = svg.append("g");
g.append("image").attr(
"xlink:href",
await toDataURL(
'https://gist.githubusercontent.com/erickrdgs/496165c55922bb65e6f03a4ccdbb4c2d/raw/ebb04026db977e8dbb63e96cc725b76277935ed5/BlackFriday.svg?sanitize=true'
)
);
svg.call(
d3
.zoom()
.extent([[0, 0], [1200, 800]])
.scaleExtent([1, 8])
.on("zoom", zoomed)
);
function zoomed() {
g.attr("transform", d3.event.transform);
}
return svg.node();
}
md`No grafo é possível observar a presença de algo em torno de 3 ou 4 grandes grupos, onde os nós com maior grau, isto é, maior número de retweets, possuem tamanho maior e suas conexões representam as contas que os retweetaram. As cores representam os diferentes grupos que encontramos.
Contas como KFC_UKI e NASA apresentam um alto número de retweets, vamos analisar mais a fundo.`
md`#### n° de retweets`
embed({
$schema: "https://vega.github.io/schema/vega-lite/v4.json",
data: {
url:
"https://gist.githubusercontent.com/erickrdgs/53e6e5c7b313b0ff63a7954d86de5a54/raw/29bd42b29a5eb88325e15ae610314a888c3526ed/blackfriday2.csv"
},
title: "Top 5 perfis",
width: 250,
height: 250,
mark: "bar",
encoding: {
y: {
field: "Freq",
type: "quantitative",
title: "Menções"
},
x: {
field: "Var1",
type: "nominal",
title: "Twitter",
sort: "x"
},
color: {
field: "Var1",
type: "nominal",
title: "Twitter"
}
}
})
md`Podemos ver uma grande discrepância entre o número de retweets das maiores contas da rede, especialmente entre o KCF_UKI e as 3 últimas contas presentes no gráfico de barras.`
embed = require("vega-embed@3")
import { toDataURL } from '@mootari/embedding-fonts-into-an-svg'
d3 = require("d3@5")
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
