25:null 26:["$","title",null,{"children":"TimeTravel | Francisco Cunha | Observable"}] 2b:T493d,/* 1) Links issue (nice to have) 4) Researchers Pics 5) Zoom (nice to have) */ chart = { const svg = d3 .create("svg") .attr("width", width) .attr("height", height); //Researchers Text svg.append("text") .join("tspan") .attr("x", margin.left) .attr("y", (height * 3 / 5) + 30) .text("Researchers") .style('font-family', '"Open Sans", sans-serif'); //SimulationForce var simulation = d3.forceSimulation(data.object) .force('forceX', d3.forceX((d) => xScale(parseTime(d.date))).strength(1)) .force('forceY', d3.forceY((d) => y(d.domain))) .force('collide', d3.forceCollide(radius + padding + 3)) .on("tick", tick); var simulation1 = d3.forceSimulation(data.person) .force('forceX', d3.forceX(width / 2).strength(3)) .force('forceY', d3.forceY(height2 + 250).strength(10)) .force('collide', d3.forceCollide(30).strength(1)) .on('tick', ticked) //ForceSimulation Ticks function tick() { svg.selectAll('#circle1') .data(data.object) .attr('cx', d => d.x) .attr('cy', d => d.y); } function ticked() { svg.selectAll('#circle2') .data(data.person) .attr('cx', d => d.x) .attr('cy', d => d.y); } const g = svg.append("g"); let links = []; let links_object_list = []; for (let i = 0; i < data.object.length; i++) { for (let p = 0; p < data.person.length; p++) { for (let j = 0; j < data.links.length; j++) { if (data.object[i].id == data.links[j].target && data.person[p].id == data.links[j].source) { const coor = d3.linkVertical()({ source: [data.person[p].x, data.person[p].y], target: [data.object[i].x, data.object[i].y] }), link_object = { color: data.object[i].Color, coord: coor, source_x: data.person[p].x, source_y: data.person[p].y, target_x: data.object[i].x, target_y: data.object[i].y, source: [data.person[p].x, data.person[p].y], target: [data.object[i].x, data.object[i].y], id_source: data.person[p].id, id_target: data.object[i].id }; links.push(coor) links_object_list.push(link_object) } } } } var link = d3.linkVertical() .source(function (d) { return [d.source[0], d.source[1]]; }) .target(function (d) { return [d.target[0], d.target[1]]; }); const gradient1 = g.append("g") .selectAll('linearGradient') .data(links_object_list) .enter().append('linearGradient') .attr("id", d => "gradient1" + d.color) .attr("spreadMethod", "reflect") .attr('cx', width / 2) .attr('cy', height / 2) .attr('r', 600) gradient1 .append("stop") .attr("offset", "30%") .attr("stop-color", "#ee2681") gradient1 .append("stop") .attr("offset", "70%") .attr("stop-color", d => d.color); gradient1.append("animate") .attr("attributeName", "x1") .attr("values", "0%;-200%") .attr("dur", "7s") .attr("repeatCount", "indefinite"); gradient1.append("animate") .attr("attributeName", "x2") .attr("values", "-100%;-300%") .attr("dur", "7s") .attr("repeatCount", "indefinite") g.selectAll("path") .data(links_object_list) .join('path') .attr("d", link) .attr('stroke-opacity', '0') .attr('stroke', d => `url(#gradient1${d.color})`) .attr('id', d => "path" + d.id_source) .attr('class', d => "path" + d.id_target) .attr('fill', 'none'); //Vertical Lines svg.selectAll('.line-decade') .data(xScale.ticks()) .join('line') .attr('class', 'line-decade') .attr('x1', d => xScale(d)) .attr('x2', d => xScale(d)) .attr('y1', 10) .attr('y2', height * 3 / 5 - margin.top) .attr('stroke-width', 1) .attr('stroke', 'lightgray'); const node = g.append("g") .selectAll("g") .data(data.person) .enter().append("g") node.append('pattern') .attr("id", d => "image"+ d.id) .attr("width", 1) .attr("height", 1) .append("svg:image") .attr("xlink:href", d => d.url) .attr("width", 40) .attr("height", 40); //BeeSwarm svg.selectAll("circle") .data(data.object) .join("circle") .attr('class', d => "circle2" + d.year + "+" + d.id) .attr("id", "circle1") .attr("r", 5) .attr("fill", d => d.Color) .on('click', function (d) {}) .on("mouseover", function (d, data) { tooltipcircle .html("

" + plus + "Score: 0.0

Date

" + data.date + "

Title

" + data.name + "

DOI

" + data.DOI + "

Knowlage Domain

" + data.domain + "

Keywords

" + data.keywords + "

Authors

" + data.authors + "

") .style('visibility', 'visible'); }) .on('mousemove', function (d) { if (d.clientX > width / 2) { tooltipcircle .style('top', d.clientY + 10 + 'px') .style('left', d.clientX - 425 + 'px') .style("display", "inline-block"); } else { tooltipcircle .style('top', d.clientY + 10 + 'px') .style('left', d.clientX + 20 + 'px') .style("display", "inline-block"); } }) .on('mouseout', function () { tooltipcircle.style('visibility', 'hidden'); }); var most_recent = '' const datalinks = data node.append("circle") //.attr('r', d => Math.random() * 30) .attr('r', 20) .attr("id", "circle2") .attr('class', d => "circle" + d.profile) .attr("fill", d => `url(#image${d.id})`) //.attr("fill", "#d7467e") .on('click', function (d, data) { if (most_recent == data.profile) { d3.selectAll('circle').style("opacity", 1); d3.selectAll('#circle2').style("opacity", 0.6); d3.select(this).attr("stroke", "black").style("opacity", 1) d3.selectAll('#circle2').on('mouseout', function (d, data) { tooltip.style('visibility', 'hidden'); d3.selectAll("path").style('stroke-opacity', '0') d3.selectAll("circle") .attr("stroke", "white") .style("opacity", 1) }); d3.selectAll('#circle2').on('mouseover', function (d, data) { let links3 = []; const links_object_list3 = []; for (let i = 0; i < datalinks.object.length; i++) { for (let p = 0; p < datalinks.person.length; p++) { for (let j = 0; j < datalinks.links.length; j++) { if (datalinks.object[i].id == datalinks.links[j].target && datalinks.person[p].id == datalinks.links[j].source) { const coor3 = d3.linkVertical()({ source: [datalinks.person[p].x, datalinks.person[p].y], target: [datalinks.object[i].x, datalinks.object[i].y] }), link_object3 = { color: datalinks.object[i].Color, coord: coor3, source_x: datalinks.person[p].x, source_y: datalinks.person[p].y, target_x: datalinks.object[i].x, target_y: datalinks.object[i].y, source: [datalinks.person[p].x, datalinks.person[p].y], target: [datalinks.object[i].x, datalinks.object[i].y], id_source: datalinks.person[p].id, id_target: datalinks.object[i].id }; links3.push(coor3) links_object_list3.push(link_object3) } } } } var link3 = d3.linkVertical() .source(function (d) { return [d.source[0], d.source[1]]; }) .target(function (d) { return [d.target[0], d.target[1]]; }); g.selectAll("path") .data(links_object_list3) .join('path') .attr("d", link3) .attr('stroke-opacity', '0') .attr('stroke', d => `url(#gradient1${d.color})`) .attr('id', d => "path" + d.id_source) .attr('class', d => "path" + d.id_target) .attr('fill', 'none'); var image = "

" tooltip .html("

" + facebook + twitter + chat + person + "Score: 0.0

" + image + "

" + data.name + "

Ph.D.

ORCID

" + data.profile + "

") .style('visibility', 'visible') filterOver("circle" + data.profile, data.id) d3.select(this).attr("stroke", "black").style("opacity", 1) d3.select(this).style("cursor", "pointer"); }) most_recent = "" } else { most_recent = data.profile d3.selectAll('circle') .style("opacity", 0) d3.select(this) .style("opacity", 1) d3.selectAll('#circle1') .style("opacity", 1) d3.selectAll('#path' + data.profile) .style("opacity", 1) d3.selectAll('#circle2') .on('mouseout', null) d3.selectAll('#circle2') .on('mouseover', null) most_recent = data.profile tooltip.html(``) .style('visibility', 'hidden') d3.select(this) .style("cursor", "pointer") d3.select(this).attr("stroke", "black").style("opacity", 1) }; }) .on('mouseover', function (d, c) { let links3 = []; const links_object_list3 = []; for (let i = 0; i < datalinks.object.length; i++) { for (let p = 0; p < datalinks.person.length; p++) { for (let j = 0; j < datalinks.links.length; j++) { if (datalinks.object[i].id == datalinks.links[j].target && datalinks.person[p].id == datalinks.links[j].source) { const coor3 = d3.linkVertical()({ source: [datalinks.person[p].x, datalinks.person[p].y], target: [datalinks.object[i].x, datalinks.object[i].y] }), link_object3 = { color: datalinks.object[i].Color, coord: coor3, source_x: datalinks.person[p].x, source_y: datalinks.person[p].y, target_x: datalinks.object[i].x, target_y: datalinks.object[i].y, source: [datalinks.person[p].x, datalinks.person[p].y], target: [datalinks.object[i].x, datalinks.object[i].y], id_source: datalinks.person[p].id, id_target: datalinks.object[i].id }; links3.push(coor3) links_object_list3.push(link_object3) } } } } var link3 = d3.linkVertical() .source(function (d) { return [d.source[0], d.source[1]]; }) .target(function (d) { return [d.target[0], d.target[1]]; }); g.selectAll("path") .data(links_object_list3) .join('path') .attr("d", link3) .attr('stroke-opacity', '0') .attr('stroke', d => `url(#gradient1${d.color})`) .attr('id', d => "path" + d.id_source) .attr('class', d => "path" + d.id_target) .attr('fill', 'none'); var image = "

" tooltip .html("

" + facebook + twitter + chat + person + "Score: 0.0

" + image + "

" + c.name + "

Ph.D.

ORCID

" + c.profile + "

") .style('visibility', 'visible') filterOver("circle" + c.profile, c.id) d3.select(this).attr("stroke", "black").style("opacity", 1) d3.select(this).style("cursor", "pointer"); }) .on('mouseout', function (d, data) { d3.selectAll("#path" + data.id).style('stroke-opacity', '0') filterOut("circle" + data.profile) d3.select(this).attr("stroke", "white").style("opacity", 1) tooltip.style('visibility', 'hidden'); }) .on('mousemove', function (d, data) { if (d.clientX > width / 2) { tooltip .style('top', d.clientY + 10 + 'px') .style('left', d.clientX - 375 + 'px') .style("display", "inline-block"); } else { tooltip .style('top', d.clientY + 10 + 'px') .style('left', d.clientX + 20 + 'px') .style("display", "inline-block"); } }); /*node.append('text') .text(d => d.name.slice(0, 2)) .attr('x', d => d.x) .attr('y', d => d.y) .style('fill', '#fff') .attr("transform" , `translate(${-10}, ${6.5})`) .attr("font-weight", "bold")*/ //AxisTop svg.append('g').call(xAxis).selectAll("text") .attr("transform", "translate(25,10)rotate(270)") .attr("color", "black"); d3.select('#clusterButton').on('click', () => { d3.selectAll("path").style('stroke-opacity', '0') d3.selectAll("#circle2").attr("pointer-events", "all"); simulation = d3.forceSimulation(data.object) .force('forceX', d3.forceX((d) => xScale(parseTime(d.date))).strength(1)) .force('forceY', d3.forceY((d) => y(d.domain))) .force('collide', d3.forceCollide(radius + padding + 3)) .restart() .on("tick", tick); document.getElementById("AllButton").disabled = false; }); d3.select('#groupButton').on('click', () => { d3.selectAll("#cicle2").attr("pointer-events", "none"); d3.selectAll("path").style('stroke-opacity', '0') simulation = d3.forceSimulation(data.object) .force('forceX', d3.forceX((d) => xScale(parseTime(d.date))).strength(6)) .force('forceY', d3.forceY(height / 4).strength(1)) .force('collide', d3.forceCollide(radius + padding + 3)) .on("tick", tick); //document.getElementById("AllButton").disabled = true; }); d3.select('#NoOneButton').on('click', () => { d3.selectAll('path') .style("stroke-opacity", 0); }); d3.select('#AllButton').on('click', () => { d3.selectAll('path') .style("stroke-opacity", 1); let links2 = []; const links_object_list2 = []; for (let i = 0; i < data.object.length; i++) { for (let p = 0; p < data.person.length; p++) { for (let j = 0; j < data.links.length; j++) { if (data.object[i].id == data.links[j].target && data.person[p].id == data.links[j].source) { const coor2 = d3.linkVertical()({ source: [data.person[p].x, data.person[p].y], target: [data.object[i].x, data.object[i].y] }), link_object2 = { color: data.object[i].Color, coord: coor2, source_x: data.person[p].x, source_y: data.person[p].y, target_x: data.object[i].x, target_y: data.object[i].y, source: [data.person[p].x, data.person[p].y], target: [data.object[i].x, data.object[i].y], id_source: data.person[p].id, id_target: data.object[i].id }; links2.push(coor2) links_object_list2.push(link_object2) } } } } var link2 = d3.linkVertical() .source(function (d) { return [d.source[0], d.source[1]]; }) .target(function (d) { return [d.target[0], d.target[1]]; }); g.selectAll("path") .data(links_object_list2) .join('path') .attr("d", link2) .attr('stroke-opacity', '0') .attr('stroke', d => `url(#gradient1${d.color})`) .attr('id', d => "path" + d.id_source) .attr('class', d => "path" + d.id_target) .attr('fill', 'none'); }); /*ZOOM svg.call(d3.zoom() .extent([[0, 0], [width, height]]) .scaleExtent([1, 8]) .on("zoom", zoomed)); function zoomed({transform}) { g.attr("transform", transform); } */ return svg.node(); }2c:Td4e,html` `2d:T705,plus = "

"2e:Ta0a,twitter = "

"2f:Te6b,chat = "

"30:Tc95,person = "

"31:[{"id":"c6efa7f126e91b9dfedd4385b246bd7f3933b8c9f08e573c21c8e996b37510c91408ccc6a8fa185418263af4c5261131ed594a96285dcdde5a6be78a41f3833a","href":"https://static.observableusercontent.com/files/c6efa7f126e91b9dfedd4385b246bd7f3933b8c9f08e573c21c8e996b37510c91408ccc6a8fa185418263af4c5261131ed594a96285dcdde5a6be78a41f3833a","name":"BeeSwarm-1@4.json","type":"application/json","lastModified":1688285980019.631,"size":39629},{"id":"fabce99becfdf07eae6f6139de2ffe58e15cc4a3b8e6b1ce0057628727b17acebace125381675e964bbe00a3f8953e12d8f45d6379f31ca0be79f4d2ef0eaf06","href":"https://static.observableusercontent.com/files/fabce99becfdf07eae6f6139de2ffe58e15cc4a3b8e6b1ce0057628727b17acebace125381675e964bbe00a3f8953e12d8f45d6379f31ca0be79f4d2ef0eaf06","name":"BeeSwarm-1@5.json","type":"application/json","lastModified":1688286222722.957,"size":41515},{"id":"4df47664e44afa4fb07be02abb53c274b5ed82d032d37977072253587006a568ea71489e2f935352510d407150abd30cc85f2f41f90f0dab6bd14d6b9c8dea9a","href":"https://static.observableusercontent.com/files/4df47664e44afa4fb07be02abb53c274b5ed82d032d37977072253587006a568ea71489e2f935352510d407150abd30cc85f2f41f90f0dab6bd14d6b9c8dea9a","name":"BeeSwarm-1@6.json","type":"application/json","lastModified":1688286457161.831,"size":41513},{"id":"721bc5a8a2aec3d11804e9d53277a11a37becc3cc742d41375f996bf70597991974e1af7dd943819785a1f99dca8bb23f028dbeea5f6cf6415746d0789c9b76c","href":"https://static.observableusercontent.com/files/721bc5a8a2aec3d11804e9d53277a11a37becc3cc742d41375f996bf70597991974e1af7dd943819785a1f99dca8bb23f028dbeea5f6cf6415746d0789c9b76c","name":"BeeSwarm-1@9.json","type":"application/json","lastModified":1688287073632.216,"size":43400},{"id":"3a51339edc2a5e8c702dffdf66e7b2f83c9e72c747ddb7a8eaf6b33392e5e307866b0c2ced9416409872c7d9bc675965e2f4179ced3765ec2d0dd899372a184d","href":"https://static.observableusercontent.com/files/3a51339edc2a5e8c702dffdf66e7b2f83c9e72c747ddb7a8eaf6b33392e5e307866b0c2ced9416409872c7d9bc675965e2f4179ced3765ec2d0dd899372a184d","name":"BeeSwarm-1@7.json","type":"application/json","lastModified":1688286505212.985,"size":38735},{"id":"fabce99becfdf07eae6f6139de2ffe58e15cc4a3b8e6b1ce0057628727b17acebace125381675e964bbe00a3f8953e12d8f45d6379f31ca0be79f4d2ef0eaf06","href":"https://static.observableusercontent.com/files/fabce99becfdf07eae6f6139de2ffe58e15cc4a3b8e6b1ce0057628727b17acebace125381675e964bbe00a3f8953e12d8f45d6379f31ca0be79f4d2ef0eaf06","name":"BeeSwarm-1@8.json","type":"application/json","lastModified":1688286552075.104,"size":41515},{"id":"6d88540a8526386d53571e97bb54c95ed4e50a1574f6c65225297e47d3bcee63b32b208dc8858b3fdee9cf515cebc73e2c3ecfe093c159638846d34c1d436337","href":"https://static.observableusercontent.com/files/6d88540a8526386d53571e97bb54c95ed4e50a1574f6c65225297e47d3bcee63b32b208dc8858b3fdee9cf515cebc73e2c3ecfe093c159638846d34c1d436337","name":"BeeSwarm-1@10.json","type":"application/json","lastModified":1688287350664.584,"size":43400},{"id":"d5cdf67f70b887ff413010763704ba30807aa9288c704c53978f7e9a6b808c992a6439724302a13e2eaae0050ea97826a4f88c35331e15edfcec82d4c45203df","href":"https://static.observableusercontent.com/files/d5cdf67f70b887ff413010763704ba30807aa9288c704c53978f7e9a6b808c992a6439724302a13e2eaae0050ea97826a4f88c35331e15edfcec82d4c45203df","name":"BeeSwarm-1@11.json","type":"application/json","lastModified":1688287560825.9,"size":37742},{"id":"76170510a2c24c49f3c9429289fbeec34969870b6fd7615da2b667565a379d0d1a4be6f850297c78dd2e1c4819c67699966117541ade6123240e079d01ab480b","href":"https://static.observableusercontent.com/files/76170510a2c24c49f3c9429289fbeec34969870b6fd7615da2b667565a379d0d1a4be6f850297c78dd2e1c4819c67699966117541ade6123240e079d01ab480b","name":"BeeSwarm-1@12.json","type":"application/json","lastModified":1688287903612.917,"size":39382},{"id":"76170510a2c24c49f3c9429289fbeec34969870b6fd7615da2b667565a379d0d1a4be6f850297c78dd2e1c4819c67699966117541ade6123240e079d01ab480b","href":"https://static.observableusercontent.com/files/76170510a2c24c49f3c9429289fbeec34969870b6fd7615da2b667565a379d0d1a4be6f850297c78dd2e1c4819c67699966117541ade6123240e079d01ab480b","name":"BeeSwarm-1@13.json","type":"application/json","lastModified":1688287937069.599,"size":39382},{"id":"32bfd95d36f515de1f63f50d4b32a3240d2a5fd8ea6312fcd03df542daaad68a2ea0276f3e33ab347ddc8f4237f19ae3c6222d1affb9c57abe5c3a843f5e3665","href":"https://static.observableusercontent.com/files/32bfd95d36f515de1f63f50d4b32a3240d2a5fd8ea6312fcd03df542daaad68a2ea0276f3e33ab347ddc8f4237f19ae3c6222d1affb9c57abe5c3a843f5e3665","name":"BeeSwarm-1@14.json","type":"application/json","lastModified":1688288204191.008,"size":39710},{"id":"b9f9127cbebcd0e520d8bf0b1572dff104c057c4a328be49541b24009007cdb45a95d5e66f23f03a9a2f037f5efbc03b2820b334dd0769cace3136c0e618b04b","href":"https://static.observableusercontent.com/files/b9f9127cbebcd0e520d8bf0b1572dff104c057c4a328be49541b24009007cdb45a95d5e66f23f03a9a2f037f5efbc03b2820b334dd0769cace3136c0e618b04b","name":"BeeSwarm-1@15.json","type":"application/json","lastModified":1688288688649.39,"size":42700}] 29:{"id":"b982056a0c5776f3","slug":"beeswarm-ivissem/2","title":"TimeTravel","thumbnail":"60b8a9cdbadc7c56b0f7e414aea3fbe8d0e966e65a5dbe39bb412a8da243fe2f","access_level":"public","create_time":"$D2021-03-19T10:08:03.728Z","update_time":"$D2023-07-14T13:08:48.918Z","view_time":null,"first_public_time":"$D2021-03-19T10:10:41.640Z","fork":true,"stars":1,"starred":false,"owner":{"type":"team","id":"d6c19ebf8f8d892d","login":"franciscocunha","name":"Francisco Cunha","avatar_url":"https://avatars-next.observableusercontent.com/5c10beb65607acf07c4a3a0ddb0936d882bac43070ef970ed5d80a26eb87b967","tier":"starter_2024"},"version":2713,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"4ed549c79120991f","login":"franciscocunha","name":"Francisco Cunha","avatar_url":"https://avatars-next.observableusercontent.com/5c10beb65607acf07c4a3a0ddb0936d882bac43070ef970ed5d80a26eb87b967","tier":null}],"members":[{"type":"individual","id":"1518e62186bc0bd1","login":"brunomiguelam","name":"Bruno Azevedo","avatar_url":"https://avatars-next.observableusercontent.com/5b247521670b13c44fb3115ddbb86ab70576b5db226f5884ee33803fc7b3a71c","tier":null,"role":"editor"},{"type":"individual","id":"4ed549c79120991f","login":"franciscocunha","name":"Francisco Cunha","avatar_url":"https://avatars-next.observableusercontent.com/5c10beb65607acf07c4a3a0ddb0936d882bac43070ef970ed5d80a26eb87b967","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":5,"collection":null,"type":"notebook","body":{"title":"TimeTravel","cells":[{"id":0,"value":"md`# TimeTravel\nThis Visualization was conceptulized, designed and implemented by Bruno Azevedo, Francisco Cunha and Pedro Branco. If you use this algorithm please reference the following article:`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1093,"value":"html` \n \n \n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"$2b","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2704,"value":"import { domainZoom } from \"b6eb2af8e1e6b237\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":890,"value":"md`# Tooltip Style Configuration`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":594,"value":"tooltip = d3\n .select('body')\n .append('div')\n .attr('class', 'd3-tooltip')\n .style('position', 'absolute')\n .style('z-index', '10')\n .style('width', '350px')\n .style('height', '225px')\n .style('visibility', 'hidden')\n .style('padding', '10px')\n .style('background', 'rgba(255,255,255)')\n .style('border-radius', '4px')\n .style('color', 'black')\n .style(\"box-shadow\", \"0px 5px 25px 0px #bdbdbd\")\n .text('a simple tooltip');","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1660,"value":"tooltipcircle = d3\n .select('body')\n .append('div')\n .attr('class', 'd3-tooltip')\n .style('position', 'absolute')\n .style('z-index', '10')\n .style('width', '400px')\n .style('height', '475px')\n .style('visibility', 'hidden')\n .style('padding', '0px')\n .style('padding', '10px')\n .style('background', 'rgba(255,255,255)')\n .style('border-radius', '4px')\n .style('color', 'black')\n .style(\"box-shadow\", \"0px 5px 25px 0px #bdbdbd\")\n .text('a simple tooltip');","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":916,"value":"md`# Margin`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"margin = ({\n left: 20,\n right: 20,\n top: 20,\n bottom: 20\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":898,"value":"md`# xScale`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":43,"value":"xScale = d3.scaleTime()\n .domain(timeExtent)\n .nice()\n .range([margin.left, width - margin.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":906,"value":"md`# yScale`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":45,"value":"yScale = d3.scaleBand()\n .domain([data.domain])\n .range([height*3/5, margin.top + 50])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":902,"value":"md`# Axis`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":320,"value":"xAxis = g => g\n .attr('transform', `translate(0,${margin.top})`)\n .attr('color', \"white\")\n .call(d3.axisTop(xScale))\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":919,"value":"md`# TimeExtent`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":921,"value":"md`Earliest and latest data date`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":54,"value":"timeExtent = {\n const dates = data.object.map((d) => parseTime(d.date)).sort(d3.ascending);\n return [dates[0], dates[dates.length - 1]];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1512,"value":" parseTime = d3.timeParse('%Y-%m-%d');","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":926,"value":"md`# Height`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":673,"value":"height = 1700","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":939,"value":"md`# Iheight`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":486,"value":"iheight = (height / 2) / 2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1083,"value":"height2 = height*3/5 + 100","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":913,"value":"md`# Padding`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":96,"value":"padding = 2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":936,"value":"md`# Raio`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"radius = 3.5","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":887,"value":"md`# Importing the data used`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"data = await FileAttachment(\"BeeSwarm-1@15.json\").json();","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":881,"value":"md`# Cores utilizadas`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"color = d3.scaleOrdinal()\n .domain([data.domain])\n .range(d3.schemeDark2)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":874,"value":"md`# SlicedData`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":871,"value":"md`Data used to represent Researchers who shared important articles, corresponding to a slice of the original data`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1103,"value":"y = d3.scaleBand()\n .domain(families)\n .range([height*3/5, margin.top + 100])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1194,"value":"family = data.object.flatMap(d => d.domain)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1232,"value":"families = family.filter(function(elem, index, self) {\n return index === self.indexOf(elem);\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":869,"value":"md`# Configuração da GRID`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":664,"value":"config = ({\n \tn: data.person.length - 1,\n rowN: 15,\n w: 20,\n h: 20,\n padding1: 30,\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":865,"value":"md`# Função filterOver`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":860,"value":"md `Função aplicada quando se coloca o mouse de cima de um recommender`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":735,"value":"function filterOver(d,c){ \n \n d3.selectAll(\"#circle2\")\n .style('opacity', '0.4');\n \n d3.selectAll('#circle1.' + d) \n .style('opacity', '1'); \n \n d3.selectAll('#path' + c) \n .style('stroke-opacity', '1');\n \n \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":850,"value":"md`# Função filterout`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":857,"value":"md `Função aplicada quando se tira o mouse de cima de um recommender`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":737,"value":"function filterOut(d){ \n d3.selectAll('circle')\n .style('opacity', '1');\n \n d3.selectAll('#circle2')\n .style('opacity', '1');\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":854,"value":"md `Função aplicada quando se clica num recommender`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":845,"value":"md`# Função filterclick`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":739,"value":"function filterClick(d){\n if (d == \"All\") { \n d3.selectAll('circle')\n .style('opacity', '1'); \n }\n else {\n d3.selectAll('circle')\n .style('opacity', '0');\n \n d3.selectAll('.' + d) \n .style('opacity', '1');\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1593,"value":"md`# CSS`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1599,"value":"tagWithOptions = impl => (...args) => {\n if (!Array.isArray(args[0])) {\n return impl(args[0]);\n }\n return impl({})(...args);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1602,"value":"interpolate = (strings, ...interpolations) => {\n let s = '';\n for (let i = 0; i < strings.length; i++) {\n s += strings[i];\n if (i < interpolations.length && interpolations[i]) {\n s += String(interpolations[i]);\n }\n }\n return dedent(s);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1604,"value":"css = tagWithOptions(({ transform }) => (...args) => {\n const source = interpolate(...args);\n const style = html`