2a:Ta1a,//building statememt md`Through analyzing the text from identified Russian accounts, Clemson researchers and FiveThirtyEight categorized accounts into multiple general categories: Right Troll, Left Troll, Hashtag Gamer, Fearmonger, and Unknown. These accounts target certain social groups to either sow discord or engender a rallying cry. Right Trolls and Left Trolls serve a similar purpose - to mold politics in the US. However, while the Right Troll focuses on rallying the Republican right, the Left Troll infiltrates social movements like BLM or other liberal enclaves. They then create negative sentiment against other liberal movements or people to socially fracture the movement. Hashtag Gamers are accounts that mainly utilize hashtags as a primary communication method, but some of their tweets are "socially divisive." Fearmongers on the other hand spread misleading or fake news to spur social outrage. Comparing against a set of random Twitter users, we can see the sentiment profile of the IRA accounts shows significant differences vs a Control group. While normal users tend to skew positive on average, the IRA accounts show a distinctly negative bent - though all groups have many tweets that fall in a range of neutral sentiment, those in the IRA tend to be more divisive, shown through the heightened frequency of negative sentiment. Even within the groups of IRA accounts, Left Trolls are less likely to be positive as opposed to Right Trolls, which indicates the fractitious nature of IRA strategy. On the other hand, Fearmongers tend to post fairly polarized tweets, as compared to other IRA accounts - they have the lowest ratio of neutral tweets among all types. However, it is clear that IRA accounts, overall, are more inflammatory than "normal users." This is immediately apparent as normal users tend to expouse positive or neutral sentiment - at much higher frequency than IRA accounts. From these pieces of evidence, we can see that though each type of IRA account has different strategems and techniques to infiltrate each group, their overall goal is to polarize the political landscape.

Control Group

Right Troll

Left Troll

Fearmonger

Hashtag Gamer

Unknown

`2b:T85e,explaination = md`How to use this visualization: Both visualizations show data from a single twitter account. This account is randomly selected based on the account category selected in the drop down menu (e.g. if "Fearmongerer" is selected in the drop down menu, then a random user will be chosen from all troll accounts labeled as being "Fearmongerers"). The chart on top shows the distribution of sentiment values for all of the tweets in the account, and the chart on the bottom plots each tweet from the account based on sentiment value. Hovering over each dot shows the text information for each tweet. With this information we are able to explore what users are saying, as well as the general sentiment of the account itself (whether the account is in general positive, negative, or evenly spread out). We can of course change the account category (to "RightTroll", for example) and view a random account from a different category. If we press the button labelled "Randomize", we change the twitter account we are looking at. A new twitter user will be selected from the same account category that we selected previously. As we can see by trying this out, the previous twitter account's sentiment distribution remains on the chart. We can continue to press this button as much as we like, and we will see the sentiment distribution of the account category converge. Repeating this on other account categories allows us to visualize the difference of general sentiment distribution between account categories, all the while we are still able to view what each account is saying by hovering over the dots in the chart below the distributions. If we would like to remove the ghosted distributions, we simply press the "Reset" button. A new account will be randomly selected with an empty background. Finally, if we are interested in viewing the sentiment of an account on a specific topic, we are able to filter the tweets and sentiment distribution shown by a keyword. Just type a word into the text input, and tweets will be automatically filtered. In order to show all tweets, simply remove the word from the input box. Enjoy! `2c:T783,function showTooltip(d, i) { const container = selectAncestor(this, "div") const boundingClientRect = this.getBoundingClientRect(); const containerBoundingClientRect = container.getBoundingClientRect(); const x = boundingClientRect.left - containerBoundingClientRect.left - 4 + (boundingClientRect.width / 2) + 223; //const y1 = boundingClientRect.top - containerBoundingClientRect.top + (boundingClientRect.height / 2); //const y2 = boundingClientRect.top - containerBoundingClientRect.top + boundingClientRect.height + 30; const y1 = boundingClientRect.top - containerBoundingClientRect.top + (boundingClientRect.height / 2) + 1475; const y2 = boundingClientRect.top - containerBoundingClientRect.top + boundingClientRect.height + 30 + 1475; console.log(x); console.log(y1); const containerDivLine = d3.select(container) .append("div") .attr("id", "tooltip-guide") .style("opacity", 0) .style("background-color", "black") .style("width", "1px") .style("position", "absolute") .style("pointer-events", "none") .style("top", `${y1}px`) .style("height", `${y2 - y1}px`) .style("left", `${x}px`) .style("width", "1px") .transition(d3.transition().duration(500)) .style("opacity", 1) const containerDiv = d3.select(container) .append("div") .attr("id", "tooltip") .style("opacity", 0) .style("background-color", "white") .style("color", "black") .style("max-width", `${500}px`) // max width .style("max-height", "350px") .style("overflow-y", "scroll") .style("padding", "10px") .style("position", "absolute") .style("pointer-events", "none") .style("border-top", `1px ${"black"} solid`) .style("box-shadow", "3px 3px 5px #cccccc") .style("top", `${y2}px`) .style("left", `${x}px`) .html(() => d.tweet) .transition(d3.transition().duration(500)) .style("opacity", 1) }2d:T6d0,function getData(){ var numNeg = 0; var numPos = 0; var numNeut = 0; var maxNeg = 0; var maxPos = 0; var maxNeut = 0; counts.forEach(function(s) { if(s.sent <= -0.5){ maxNeg = maxNeg + s.num; }else if(s.sent <= 0.5){ maxNeut = maxNeut + s.num; }else{ maxPos = maxPos + s.num; } }); if(maxNeg+maxNeut+maxPos > 60){ maxNeg = Math.round(maxNeg/5); maxPos = Math.round(maxPos/5); maxNeut = Math.round(maxNeut/5); } //shuffle(full_data[randomUser]); var data_sample = []; var sent_vals = new Set([]); var idx = 0; var curr = full_data[randomUser]; while((numNeg < maxNeg || numPos < maxPos || numNeut < maxNeut) && curr.tweets.length > idx){ if(filter != "" && !(curr.tweets[idx].toLowerCase().includes(filter.toLowerCase()))){ idx = idx + 1; continue } if(curr.sentiments[idx] < -0.5 && numNeg < maxNeg && !(sent_vals.has(curr.sentiments[idx]))){ data_sample.push({"tweet":curr.tweets[idx],"sent":curr.sentiments[idx]}); sent_vals = sent_vals.add(curr.sentiments[idx]); numNeg = numNeg + 1; }if(curr.sentiments[idx] > 0.5 && numPos < maxPos && !(sent_vals.has(curr.sentiments[idx]))){ data_sample.push({"tweet":curr.tweets[idx],"sent":curr.sentiments[idx]}); sent_vals = sent_vals.add(curr.sentiments[idx]); numPos = numPos + 1; }else if(curr.sentiments[idx] < 0.5 && curr.sentiments[idx] > -0.5 && numNeut < maxNeut && !(sent_vals.has(curr.sentiments[idx]))){ data_sample.push({"tweet":curr.tweets[idx],"sent":curr.sentiments[idx]}); sent_vals = sent_vals.add(curr.sentiments[idx]); numNeut = numNeut + 1; } idx = idx + 1; } return data_sample; }2e:T93d,renderChart = (target) => { var area = d3.area().curve(d3.curveMonotoneX) .x(function(d) {return xScale(parseFloat(d.sent));}) .y0(height - margin.bottom) .y1(function(d) {return yScale(d.num);}); var grad = target.append("defs") .append("linearGradient") .attr("id", "grad"); grad.append("stop").attr("offset", "0%").attr("stop-color", "red"); grad.append("stop").attr("offset", "25%").attr("stop-color", "red"); grad.append("stop").attr("offset", "25%").attr("stop-color", "grey"); grad.append("stop").attr("offset", "75%").attr("stop-color", "grey"); grad.append("stop").attr("offset", "75%").attr("stop-color", "green"); grad.append("stop").attr("offset", "100%").attr("stop-color", "green"); target.selectAll('circle') .data(percents) .enter().append('circle') .attr('r', 1) // .attr("fill", d => { if(d.sentiment > 0.5){ // return "green"; // }else if(d.sentiment < -0.5){ // return "red"; // }else{ // return "gray";}}) .attr("fill", "steelblue") .attr('cx', d => xScale(parseFloat(d.sent))) .attr('cy', d => yScale(d.num)) .on("mouseover", showTooltip) .on("mouseout", hideTooltip); target.append('g') .call(xAxis); target.append('g') .call(yAxis); for(var i = 0; i < ghost.length; i++){ target.append("path") .datum(ghost[i]) .attr("class", "area") .attr("d", area) /*.attr("fill", function(d){ if(d.sent >.5){ return "green";} else if(d.sent < -.5){return "red";} else{return "gray";} })*/ .style("fill", "url(#grad)") .style("opacity", .1); } target.append("path") .datum(percents) .attr("fill", "none") .attr("stroke", "lightskyblue") .attr("stroke-width", 2) .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("d", line); target.append("path") .datum(percents) .attr("fill", "none") .attr("stroke", "steelblue") .attr("stroke-width", 1.5) .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("d", line); }2f:T42b,function getSentimentCounts(){ var dict = {}; dict[-1.0] = []; for (let i = -0.9; i < 1.0; i += 0.1) { if (parseInt(i) !== 0) dict[0] = []; else dict[i.toFixed(1)] = []; } var rand = randomUser; console.log(full_data[rand].category); var arrayLength = full_data[rand].tweets.length; for (var i = 0; i < arrayLength; i++) { var curr = full_data[rand]; if(filter != "" && !(curr.tweets[i].toLowerCase().includes(filter.toLowerCase()))){ continue; } var sent = Math.round(curr.sentiments[i]*10)/10; if(sent in dict){ dict[sent].push(curr); }else{ dict[sent] = [curr]; } } var total = 0; var counts = []; for(var key in dict){ counts.push({"sent":parseFloat(key), "num":dict[key].length}); total = total + dict[key].length; } var percents = []; for(var i = 0; i < counts.length; i++){ percents.push({"sent":counts[i].sent,"num":100*counts[i].num/total}); } return {"counts":sortByKey(counts,"sent"), "percents":sortByKey(percents,"sent")}; }30:[] 29:{"title":"Camouflage in the Cloud: Discerning Russian Troll Tweets","cells":[{"id":0,"value":"md`# Camouflage in the Cloud: Discerning Russian Troll Tweets`","pinned":false,"hidden":false,"mode":"ojs"},{"id":896,"value":"//intro \nmd`*Using the [FiveThirtyEight Russian tweet data](https://github.com/fivethirtyeight/russian-troll-tweets), collected by Clemson University*.
\n\nRussian interference is prolific on the internet, stemming from a campaign of state-sponsored disinformation by the Russian Government Agency the Internet Research Agency. These agents work to destabilize political fronts and shape the ideological landscape to their benefit.
Though the agency is active on many social media sites, such as Instagram, Facebook, Tumblr, their reach is most notable on Twitter. Though Russian agents appear to be legitimate users at first, but their accounts and activity show obvious differences from normal users, made visible by sentiment analysis.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":898,"value":"$2a","pinned":false,"hidden":false,"mode":"ojs"},{"id":648,"value":"viewof category = select({\n title: \"Troll category\",\n description: \"Pick the category of troll account, or a normal twitter user with 'Control'\",\n options: [\"RightTroll\",\"Fearmonger\",\"LeftTroll\",\"Unknown\",\"HashtagGamer\",\"Control\"],\n value: \"RightTroll\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":331,"value":"random = {\n const button1 = button({value: \"Randomize Account\", description: \"Change account within Troll category\"});\n button1.onclick = () => {\n mutable randomUser = parseInt(Math.random() * full_data.length);\n // for(var i = 0 ; i < full_data.length; i++){\n // if(full_data[randomUser].category === category){\n // break;\n // }\n // else {\n // mutable randomUser = parseInt(Math.random() * full_data.length);\n // }\n // }\n addGhost(); \n yAcc()}\n return button1;\n}\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":690,"value":"reset = {\n const button1 = button({value: \"Reset Visualization\"});\n button1.onclick = () => {\n mutable ghost = []; \n //mutable seenSet = [];\n mutable randomUser = parseInt(Math.random() * full_data.length);\n // for(var i = 0 ; i < full_data.length; i++){\n // if(full_data[randomUser].category === category){\n // //console.log(full_data[randomUser].category,category);\n // break;\n // }\n // else {\n // mutable randomUser = parseInt(Math.random() * full_data.length);\n // }\n // }\n getData();\n renderChart(); \n addGhost(); \n yAcc()}\n return button1;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":928,"value":"viewof filter = text({title: \"Filter tweets by word\", placeholder: \"\", description: \"Type a word to search for\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"topchart = {\n const svg = d3.select(DOM.svg(width, height))\n .classed('chart', true);\n \n renderChart(svg, data);\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":610,"value":"bottomchart = {\n const svg = d3.select(DOM.svg(width, height))\n .classed('chart', true);\n \n //dotChart(svg, data);\n svg.selectAll('circle')\n .data(data)\n .enter().append('circle')\n .attr('r', 5)\n .attr(\"fill\", d => { if(parseFloat(d.sent) > 0.5){\n return \"green\"; \n }else if(parseFloat(d.sent) < -0.5){\n return \"red\";\n }else{\n return \"gray\";}})\n .attr('cx', d => xScale(parseFloat(d.sent)))\n .attr('cy', d => yScale2(\"tweet\"))\n .on(\"mouseover\", showTooltip)\n .on(\"mouseout\", hideTooltip); \n \n \n svg.append('g')\n .call(xAxis);\n svg.append('g')\n .call(yAxis2);\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":939,"value":"$2b","pinned":false,"hidden":false,"mode":"ojs"},{"id":410,"value":"function selectAncestor (elem, type) {\n type = type.toLowerCase();\n if (elem.parentNode === null) {\n console.log(\"No more parents\");\n return undefined;\n }\n var tagName = elem.parentNode.tagName;\n\n if ((tagName !== undefined) && (tagName.toLowerCase() === type)) {\n return elem.parentNode;\n } else {\n return selectAncestor (elem.parentNode, type);\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":409,"value":"$2c","pinned":false,"hidden":false,"mode":"ojs"},{"id":415,"value":"function hideTooltip() {\n d3.selectAll(\"#tooltip\")\n .transition(d3.transition().duration(500))\n .style(\"opacity\", 0)\n .on(\"end\", function() {\n d3.select(this).remove()\n })\n\n d3.selectAll(\"#tooltip-guide\")\n .transition(d3.transition().duration(500))\n .style(\"opacity\", 0)\n .on(\"end\", function() {\n d3.select(this)\n .remove()\n })\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":636,"value":"full_data_csv = {const csv_data = await d3.tsv(\"https://media.githubusercontent.com/media/roop-pal/russian-troll-tweets-visualization/master/full_troll_tweet_sentiments.tsv\", d => {\n const category = d.category;\n if (d.tweets.includes('\\\\')) {return}\n var tweets = JSON.parse(d.tweets);\n var sentiments = JSON.parse(d.sentiments);\n if(tweets.length < 20){return}\n return {\"category\":category, \"sentiments\":sentiments, \"tweets\":tweets}\n })\n return csv_data;}","pinned":false,"hidden":false,"mode":"ojs"},{"id":786,"value":"full_data_dict = {\n const concatted = full_data_csv.concat(control_csv_data);\n var dict = {};\n for(var i = 0; i < concatted.length; i++){\n if(concatted[i].category in dict){\n dict[concatted[i].category].push(concatted[i]);\n }else{\n dict[concatted[i].category] = [concatted[i]];\n }\n }\n return dict;\n }\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":875,"value":"full_data = {\n var toReturn = full_data_dict[category];\n mutable randomUser = parseInt(Math.random() * toReturn.length);\n return toReturn;\n }","pinned":false,"hidden":false,"mode":"ojs"},{"id":782,"value":"control_csv_data = {const csv_data = await d3.tsv(\"https://media.githubusercontent.com/media/roop-pal/russian-troll-tweets-visualization/master/random_tweet_sentiments.tsv\", d => {\n const category = \"Control\";\n if (d.tweets.includes('\\\\')) {return}\n const tweets = JSON.parse(d.tweets);\n const sentiments = JSON.parse(d.sentiments);\n if(tweets.length < 20){return};\n return {\"category\":category, \"sentiments\":sentiments, \"tweets\":tweets}\n })\n return csv_data;}","pinned":false,"hidden":false,"mode":"ojs"},{"id":405,"value":"mutable data = getData()","pinned":false,"hidden":false,"mode":"ojs"},{"id":388,"value":"$2d","pinned":false,"hidden":false,"mode":"ojs"},{"id":354,"value":"function shuffle(a) {\n for (let i = a.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [a[i], a[j]] = [a[j], a[i]];\n }\n return a;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":14,"value":"//height = 500 //normal\nheight = 200","pinned":false,"hidden":false,"mode":"ojs"},{"id":16,"value":"width = 700","pinned":false,"hidden":false,"mode":"ojs"},{"id":18,"value":"margin = ({ top: 20, right: 20, bottom: 20, left: 50 }) // normal\n//margin = ({ top: 20, right: 200, bottom: 20, left: 200 }) //for ordinal on x axis\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":530,"value":"mutable maxY = 0","pinned":false,"hidden":false,"mode":"ojs"},{"id":548,"value":"function yAcc(){\n var x = d3.max(percents, d => parseFloat(d.num))\n if(x>maxY){\n mutable maxY = x\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":20,"value":"// xScale = d3.scaleOrdinal()\n// .domain([\"highly negative\", \"neutral\", \"highly positive\"]) \n// .range([margin.left+50, (width - margin.right +margin.left+50)/2, width - margin.right])\n\nyScale = d3.scaleLinear()\n //.domain([0,d3.max([maxY, d3.max(percents, d => parseFloat(d.num))])]) \n .domain([0,100])\n .range([height - margin.bottom, margin.top])\n //.tickFormat(function(d){return d+ \"%\"})\n\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":614,"value":"yScale2 = d3.scaleOrdinal()\n .domain([\"tweet\"]) \n .range([(height - margin.top + margin.bottom)/2])","pinned":false,"hidden":false,"mode":"ojs"},{"id":24,"value":"// yScale = d3.scaleLinear()\n// .domain([d3.min(data, d => parseFloat(d.sentiment)), d3.max(data, d => parseFloat(d.sentiment))])\n// .range([height - margin.bottom, margin.top])\nxScale = d3.scaleLinear()\n //.domain([d3.max(counts, d => parseFloat(d.sent)), d3.min(counts, d => parseFloat(d.sent))])\n .domain([1, -1])\n .range([width - margin.right, margin.left + 10])","pinned":false,"hidden":false,"mode":"ojs"},{"id":26,"value":"// xAxis = g => g.attr('transform', `translate(0, ${height - margin.bottom})`)\n// .attr(\"class\", \"xAxis\")\n// .call(d3.axisBottom(xScale))\nxAxis = g => g.attr('transform', `translate(0, ${height - margin.bottom})`)\n .attr(\"class\", \"xAxis\")\n .call(d3.axisBottom(xScale))\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":28,"value":"// yAxis = g => g.attr('transform', `translate(${margin.left}, 0)`)\n// .attr(\"class\", \"yAxis\")\n// .call(d3.axisLeft(yScale))\n\nyAxis = g => g.attr('transform', `translate(${margin.left}, 0)`)\n .attr(\"class\", \"yAxis\")\n .call(d3.axisLeft(yScale).tickFormat(function(d){return d+ \"%\"}))\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":616,"value":"yAxis2 = g => g.attr('transform', `translate(${margin.left}, 0)`)\n .attr(\"class\", \"yAxis\")\n .call(d3.axisLeft(yScale2))","pinned":false,"hidden":false,"mode":"ojs"},{"id":30,"value":"$2e","pinned":false,"hidden":false,"mode":"ojs"},{"id":612,"value":"dotChart = (target) => {\n \n target.selectAll('circle')\n .data(data)\n .enter().append('circle')\n .attr('r', 5)\n .attr(\"fill\", d => { if(parseFloat(d.sent) > 0.5){\n return \"green\"; \n }else if(parseFloat(d.sent) < -0.5){\n return \"red\";\n }else{\n return \"gray\";}})\n .attr('cx', d => xScale(parseFloat(d.sent)))\n .attr('cy', d => yScale2(\"tweet\"))\n .on(\"mouseover\", showTooltip)\n .on(\"mouseout\", hideTooltip); \n \n \n target.append('g')\n .call(xAxis);\n target.append('g')\n .call(yAxis2);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":22,"value":"d3 = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":422,"value":"import {text, select, button} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":469,"value":"function sortByKey(array, key) {\n return array.sort(function(a, b) {\n var x = a[key]; var y = b[key];\n return ((x < y) ? -1 : ((x > y) ? 1 : 0));\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":449,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs"},{"id":514,"value":"function addGhost(){\n mutable ghost = ghost.concat([percents])\n return ghost\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":511,"value":"mutable ghost = []","pinned":false,"hidden":false,"mode":"ojs"},{"id":451,"value":"percents = getSentimentCounts().percents","pinned":false,"hidden":false,"mode":"ojs"},{"id":626,"value":"counts = getSentimentCounts().counts","pinned":false,"hidden":false,"mode":"ojs"},{"id":465,"value":"line = d3.line()//.curve(d3.curveCardinal)\n .defined(d => !isNaN(d.num))\n .x(d => xScale(d.sent))\n .y(d => yScale(d.num))","pinned":false,"hidden":false,"mode":"ojs"},{"id":487,"value":"mutable randomUser = 0","pinned":false,"hidden":false,"mode":"ojs"},{"id":727,"value":"mutable seenSet = new Set([])","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W30","stdlib":"1","titling":"auto"}