2b:null 2c:["$","title",null,{"children":"NU Khoury College Faculty | John Alexis Guerra Gómez | Observable"}] 31:T1e1a,chart = { const svg = this ? d3.select(this).select("svg") : d3.create("svg"); svg .attr("width", width) .attr("height", height) .attr("viewBox", [0, 0, width, height]) .attr( "style", "max-width: 100%; height: auto; height: intrinsic; overflow: visible" ); svg .append("clipPath") .attr("id", "circleClip") .append("circle") .attr("cx", 0) .attr("cy", 0) .attr("r", nodeSize); graph.nodes.map( (d) => (d.r = d.type === "Faculty" ? nodeSize * (d.degree / 2 + 1) : greyNodeSize) ); const chargeScale = d3 .scaleLinear() .domain([20, 160]) .range([width < 800 ? -100 : -200, width < 800 ? -50 : -100]); const chargeStrength = (d) => (nodeSize / 7) * (d.degree > 1 ? 1 : 0.7) * chargeScale(graph.nodes.length); const simulation = d3 .forceSimulation(graph.nodes) .alpha(3) .force( "link", d3 .forceLink(graph.links) .id((d) => d.name) .distance(10) .strength(0.1) ) .force( "charge", d3.forceManyBody().strength(chargeStrength) // .strength((d) => (d.degree*2) * chargeScale(graph.nodes.length)) ) .force("collide", d3.forceCollide((d) => d.r*1.3).iterations(4)) // .force("center", d3.forceCenter(width / 2, height / 2)) .force("x", d3.forceX(width / 2).strength(0.1)) .force("y", d3.forceY(height / 2).strength((0.07 * width) / height)); // -------- HULLS --------- const area = d3.line().curve(d3.curveCardinalClosed); const hp = hullPadding; const getHull = (d) => { const points = d[1] .filter((d) => showGroupingNodes || d.type === "Faculty") .map((n) => [ [n.x - (n.r + hp), n.y], [n.x + n.r + hp, n.y], [n.x, n.y + n.r + hp], [n.x, n.y - (n.r + hp)] ]) .flat(); const hull = d3.polygonHull(points); return hull && area(hull); }; const hullG = this ? svg.select("g#gHulls") : svg.append("g").attr("id", "gHulls"); const hull = hullG .selectAll("path.hull") .data( graph.clusters.filter( ([id, _]) => !excludeKhouryHull || id !== "Khoury College of Computer Sciences" ), (d) => d[0] ) .join("path") .attr("class", "hull") // .attr("d", getHull) .attr("fill", (d) => hullColor(d[0])) .attr("opacity", 0.3) .attr("pointer-events", "none"); // -------- LINKS --------- const linkG = this ? svg.select("g#gLinks") : svg.append("g").attr("id", "gLinks"); const link = linkG .attr("stroke", "#999a") .attr("stroke-opacity", 1) .attr("stroke-width", 0.5) .attr("stroke-linecap", "round") .selectAll("line") .data( graph.links.filter( (d) => showGroupingNodes || d.target.type === "Faculty" ), (d) => `${d.source.name}-${d.target.name}` ) .join("line"); // -------- NODES --------- const nodeG = this ? svg.select("g#gNodes") : svg.append("g").attr("id", "gNodes"); const node = nodeG .selectAll("circle") .data( graph.nodes.filter( (d) => showGroupingNodes || d.type === "Faculty" // hide grey nodes ), (d) => d.name ) .join("circle") .attr("fill", (d) => (d.type !== "Faculty" ? "#999" : hullColor(d.cluster))) // .attr("stroke", "black") .attr("stroke-opacity", 1) .attr("stroke-width", 1) .attr("r", (d) => d.r) .call(drag(simulation)); // -------- LABELS --------- const getNameArray = (d) => (d.nameArray ? d.nameArray : d.name.split(" ")); const fontSizeFn = (d) => fontSize * (d.type === "Faculty" ? d.r / nodeSize / 2 : 1.8); const lineWidth = 1.3; const createLabels = (_data, className = "facultyLabel") => nodeG .selectAll(`text.${className}`) .data(_data, (d) => d.name) .join("text") .attr("class", className) .attr("text-align", "center") .attr("text-anchor", "middle") // .attr( // "dy", // (d) => 5 + d.r + (d.type === "Faculty" ? fontSize : fontSize * 1.6) // ) .attr("font-size", (d) => `${fontSizeFn(d)}pt`) .attr("font-weight", (d) => (d.type === "Faculty" ? "light" : "bolder")) .attr("font-family", "Oswald") .attr("pointer-events", "none") .style("clip-path", (d) => clipLabels && d.type === "Faculty" ? `circle(${d.r}px at 50% 50%)` : "" ) // .text((d) => d.name); .each(function (d) { return ( d3 .select(this) .selectAll("tspan") .data(getNameArray) .join("tspan") .attr("x", 0) // 1.3 for each line, but then move back for centering on y .attr("dy", (d) => fontSizeFn(d) + "pt" ) .attr("dy", "2.3ch") .text((n) => n) ); }) .attr("y", (d) => (getNameArray(d).length / 2) * -lineWidth + "ch"); // Create labels for faculty, so it is behind the image const label = createLabels( graph.nodes.filter((d) => d.type === "Faculty" ? d.degree >= minDegree : 0 ), "facultyLabel" ); // ---------- IMAGES --------------- const images = nodeG .selectAll("image") .data( useImages ? graph.nodes.filter( (d) => d.type === "Faculty" && d.photo && d.photo.toUpperCase().indexOf("JPG") !== -1 ) : [], (d) => d.name ) .join("image") .attr("href", (d) => d.photo) .attr("width", (d) => d.r * 2 - 4) .attr("height", (d) => d.r * 2 - 4) .attr("stroke", "black") .attr("preserveAspectRatio", "xMidYMid slice") .attr("transform", (d) => `translate(-${d.r - 2}, -${d.r - 2})`) .style("clip-path", (d) => `circle(${d.r - 2}px)`) .call(drag(simulation)); function ticked() { link // .attr("display", simulation.alpha() <= 0.1 ? "block" : "none") .attr("x1", (d) => d.source.x) .attr("y1", (d) => d.source.y) .attr("x2", (d) => d.target.x) .attr("y2", (d) => d.target.y); label .attr("transform", (d) => `translate(${d.x}, ${d.y})`) .classed("shadow", simulation.alpha() <= 0.1); labelDepts .attr("transform", (d) => `translate(${d.x}, ${d.y})`) .classed("shadow", simulation.alpha() <= 0.1); node .attr("cx", (d) => d.x) .attr("cy", (d) => d.y) .classed("shadow", simulation.alpha() <= 0.1); useImages && images // .attr("transform", (d) => `translate(${d.x}, ${d.y})`) .attr("x", (d) => d.x) .attr("y", (d) => d.y); hull.attr("d", getHull); } // --------- Department Labels ------------ const labelDepts = createLabels( graph.nodes.filter((d) => d.type !== "Faculty"), "departmentLabel" ); simulation.on("tick", ticked); // ----------- Drag ---------------- function drag(simulation) { function dragstarted(event) { if (!event.active) simulation.alphaTarget(0.3).restart(); event.subject.fx = event.subject.x; event.subject.fy = event.subject.y; } function dragged(event) { event.subject.fx = event.x; event.subject.fy = event.y; } function dragended(event) { if (!event.active) simulation.alphaTarget(0); event.subject.fx = null; event.subject.fy = null; } return d3 .drag() .on("start", dragstarted) .on("drag", dragged) .on("end", dragended); } // ----------- /Drag ---------------- invalidation.then(() => simulation.stop()); ticked(); return htl.html`

Khoury Faculty by ${groupBy}

${svg.node()}

`; }32:T4eb,viewof colorInterpolator = { const colorSchemes = [ "interpolateBlues", "interpolateBrBG", "interpolateBuGn", "interpolateBuPu", "interpolateCividis", "interpolateCool", "interpolateCubehelixDefault", "interpolateGnBu", "interpolateGreens", "interpolateGreys", "interpolateInferno", "interpolateMagma", "interpolateOrRd", "interpolateOranges", "interpolatePRGn", "interpolatePiYG", "interpolatePlasma", "interpolatePuBu", "interpolatePuBuGn", "interpolatePuOr", "interpolatePuRd", "interpolatePurples", "interpolateRainbow", "interpolateRdBu", "interpolateRdGy", "interpolateRdPu", "interpolateRdYlBu", "interpolateRdYlGn", "interpolateReds", "interpolateSinebow", "interpolateSpectral", "interpolateString", "interpolateTurbo", "interpolateViridis", "interpolateWarm", "interpolateYlGn", "interpolateYlGnBu", "interpolateYlOrBr", "interpolateYlOrRd" ]; const colors = new Map( [["Custom Turbo", (t) => d3.interpolateTurbo(0.2 + t * 0.8)]].concat( colorSchemes.map((c) => [c, d3[c]]) ) ); return Inputs.select(colors, { label: "Color Scheme", format: (d) => d[0] }); }33:T5f9,graph = { for (let n of dData.values()) { n.degree = 0; } const linksArray = links.objects(); for (let l of linksArray) { const source = dData.get(l.source); // target = dNodes.get(l.target); source.cluster = l.target; // target.cluster = l.target; source.degree += 1; // target.degree += 1; } const getOrCreateNode = (name) => { let node = dConnections.get(name); if (!node) { node = { name, type: "Connection", cluster: name, x: width / 2 + (Math.random() * width) / 10, y: height / 2 + (Math.random() * height) / 10 }; dConnections.set(name, node); } return node; }; // --------- Filter Links and Nodes -------------- const filteredLinks = linksArray.map((l) => { return { source: dData.get(l.source), target: getOrCreateNode(l.target) }; }); const filteredNodesObject = filteredLinks.reduce( (p, l) => { if (!p.set.has(l.source.name)) { p.set.add(l.source.name); p.list.push(l.source); } if (!p.set.has(l.target.name)) { p.set.add(l.target.name); p.list.push(l.target); } return p; }, { set: new Set(), list: [] } ); // Clusters is used for the hulls const clusters = d3.rollups( filteredLinks, (v) => v.map((l) => l.source).concat([v[0].target]), (d) => d.target.name ); return { nodes: filteredNodesObject.list, links: linksArray, clusters: clusters }; }34:T6cd,data = d3 .csv( "https://docs.google.com/spreadsheets/d/e/2PACX-1vTX-fbHzk70bzNUMJxwNKsMnkEbtXJ0SPh9Fa8HZy-NRbn2gg721RIWD-wvFZv5xZta7uZLVJOgKgN2/pub?gid=0&single=true&output=csv" ) // FileAttachment("Faculty_May_2023@1.csv") // .csv({ typed: true }) .then((res) => { for (let d of res) { d.name = `${d["First Name"]} ${d["Last Name"]}`; d.nameArray = d.name.split(" "); d.date = dateFmt(d["Year Highest Degree Received"]); d.type = "Faculty"; d["Interdisciplinary College 4"] = "Khoury College of Computer Sciences"; d["Job Title"] = d["Job Profile"]; if (dDataScrapped.has(d.name)) { const s = dDataScrapped.get(d.name); d.Campus = s.location; d["Job Title"] = d.position; } d.Campus = d.Campus == "NU Boston Campus" ? "Boston": d.Campus; d.photo = photosMap.get(d.name); } const dData = new Map(res.map(d => [d.name, d])); for (let d of facultyFromScrape.filter(d => !dData.has(d.name))) { res.push({ ...d, name: d.name, "First Name": d.name.split(" ")[0], "Last Name": d.name.split(" ").slice(1).join(" "), "Job Profile": d.position, "Title": d.position, "Job Title": d.position, Campus: d.location, "Interdisciplinary Dept 1": "Khoury", "Interdisciplinary College 1": "Khoury College of Computer Sciences", "Interdisciplinary College 4": "Khoury College of Computer Sciences", "Interdisciplinary College 3": "", "Interdisciplinary College 2": "", "Research Areas": "AI", "Academic Track Type": "", date: new Date(), type: "Faculty", }) } return res; })35:[{"id":"f5c4a9d4101d8d45c1dcd68c185181631218e5fba1530168f56ea7e1fc8b698365140025c22124a4991f2e161bd15463f7e688e38892951c41db077b77311ebd","href":"https://static.observableusercontent.com/files/f5c4a9d4101d8d45c1dcd68c185181631218e5fba1530168f56ea7e1fc8b698365140025c22124a4991f2e161bd15463f7e688e38892951c41db077b77311ebd","name":"khouryFacultyScrapped_2024_03Mar_15.csv","type":"text/csv","lastModified":1710547378550.932,"size":112900},{"id":"3282c07d74592f651bdd832349676d3bbdb0f601b8dc828fe6b2431a1c7a63f12f08108db14dd8f16ac2a681439550b83f6ef5f154f0debba550fad2233a58e2","href":"https://static.observableusercontent.com/files/3282c07d74592f651bdd832349676d3bbdb0f601b8dc828fe6b2431a1c7a63f12f08108db14dd8f16ac2a681439550b83f6ef5f154f0debba550fad2233a58e2","name":"khouryFacultyScrapped_2024_09Sep_18.csv","type":"text/csv","lastModified":1726678256459.546,"size":113445},{"id":"6c3cb5ff224b063eccdfe0b20f430ad204c9a9ffb94e05296d430457640f5cf7953c935f11f52770ee216de9380b3cdde984e2dc1fd6f51836e3b6bc8d192ddb","href":"https://static.observableusercontent.com/files/6c3cb5ff224b063eccdfe0b20f430ad204c9a9ffb94e05296d430457640f5cf7953c935f11f52770ee216de9380b3cdde984e2dc1fd6f51836e3b6bc8d192ddb","name":"Faculty_May_2022.csv","type":"text/csv","lastModified":1654103174818.879,"size":32547},{"id":"0c42d5d9a5e51e775adc5496b653a647ffd7faf12dd8ddbe1469e42a3cd5d1841d146ab8b275935af3b5afa49e3d6114401d411a0417b61decaff534602bd5d7","href":"https://static.observableusercontent.com/files/0c42d5d9a5e51e775adc5496b653a647ffd7faf12dd8ddbe1469e42a3cd5d1841d146ab8b275935af3b5afa49e3d6114401d411a0417b61decaff534602bd5d7","name":"Faculty_May_2023@1.csv","type":"text/csv","lastModified":1682986093962.427,"size":40060},{"id":"a234c0cce4aec2acfa404e23de5537efbe4aeefbb1adca2be25fbeefc06d8b62e77e18aaa13102ee31b87d84e5c4d8032f10bc98ef6f204279089b6a48e7bc4e","href":"https://static.observableusercontent.com/files/a234c0cce4aec2acfa404e23de5537efbe4aeefbb1adca2be25fbeefc06d8b62e77e18aaa13102ee31b87d84e5c4d8032f10bc98ef6f204279089b6a48e7bc4e","name":"khouryFacultyScrapped_2023_05May_02.csv","type":"text/csv","lastModified":1683065895183.608,"size":99188},{"id":"a234c0cce4aec2acfa404e23de5537efbe4aeefbb1adca2be25fbeefc06d8b62e77e18aaa13102ee31b87d84e5c4d8032f10bc98ef6f204279089b6a48e7bc4e","href":"https://static.observableusercontent.com/files/a234c0cce4aec2acfa404e23de5537efbe4aeefbb1adca2be25fbeefc06d8b62e77e18aaa13102ee31b87d84e5c4d8032f10bc98ef6f204279089b6a48e7bc4e","name":"Faculty_Sep_2023.csv","type":"text/csv","lastModified":1695222772464.315,"size":99188}] 2f:{"id":"0eea8017bc7a02ac","slug":"khoury-faculty","title":"NU Khoury College Faculty","thumbnail":"f9284f5319e0e7a0f3b9c1ef712c396751fcef0bcf3307c2d8931f0153c1f728","access_level":"public","create_time":"$D2022-06-01T17:05:25.524Z","update_time":"$D2024-09-18T19:02:55.334Z","view_time":null,"first_public_time":"$D2023-04-18T07:44:40.794Z","fork":false,"stars":3,"starred":false,"owner":{"type":"team","id":"cd3c1e49fc84d010","login":"john-guerra","name":"John Alexis Guerra Gómez","avatar_url":"https://avatars-next.observableusercontent.com/21638cee44bb0ea70798da725b57111a5d3e2acebcd14524565992f7d1594aed","tier":"starter_2024"},"version":1892,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"be0076fec73aa550","login":"john-guerra","name":"John Alexis Guerra Gómez","avatar_url":"https://avatars-next.observableusercontent.com/21638cee44bb0ea70798da725b57111a5d3e2acebcd14524565992f7d1594aed","tier":null}],"members":[{"type":"individual","id":"be0076fec73aa550","login":"john-guerra","name":"John Alexis Guerra Gómez","avatar_url":"https://avatars-next.observableusercontent.com/21638cee44bb0ea70798da725b57111a5d3e2acebcd14524565992f7d1594aed","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":4,"collection":null,"type":"notebook","body":{"title":"NU Khoury College Faculty","cells":[{"id":0,"value":"# NU Khoury College Faculty\n\nNortheastern University's Khoury College of Computer Science has a very diverse and multidisciplinary set of Faculty. Here you can see professors with affiliations with other departments. Data updated to 2022, we are working on getting it updated.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":329,"value":"viewof groupBy = {\n // `[\"Last Name\",\"First Name\",\"Appointments\",\"Job Profile\",\"Picture URL\",\"Research Areas\",\"Labs and Groups\",\"Institutes and Centers\",\"Date of joining NU\",\"Courses\",\"Campus\",\"Supervisory Organization\",\"Title\",\"Academic Track Type\",\"Degrees\",\"Last School Attended\",\"Year Highest Degree Received\",\"Interdisciplinary Dept 1\",\"Interdisciplinary College 1\",\"Interdisciplinary Dept 2\",\"Interdisciplinary College 2\",\"Interdisciplinary Dept 3\",\"Interdisciplinary College 3\",\"name\",\"selected\",\"__seqId\",\"__i\",\"Appointment\"]`\n\n const attrs = [\n \"Appointment\",\n \"Job Title\",\n // \"Job Profile\",\n \"Campus\",\n \"Research Areas\",\n \"Academic Track Type\",\n \"Degrees\",\n // \"Labs and Groups\",\n \"Institutes and Centers\",\n \"Supervisory Organization\",\n // \"Last School Attended\"\n ];\n return Inputs.select(attrs, { label: \"Group By\", value: \"Appointment\" });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":436,"value":"viewof selectedTargets = {\n const targetNames = tidyData\n .groupby(groupBy)\n .count()\n .objects()\n .map((d) => d[groupBy])\n .filter((d) => d);\n const selection =\n groupBy === \"Appointment\"\n ? targetNames.filter((d) => d !== \"Khoury College of Computer Sciences\")\n : targetNames;\n const cr = 15;\n return Inputs.checkbox(targetNames, {\n label: \"Show\",\n value: selection,\n format: (d) => html`

\n${d}

`\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":498,"value":"viewof height = Inputs.range([200, 1400], {label: \"height\", step:1, value: 600})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1027,"value":"Faculty who graduated before ${minDate.toLocaleDateString()} (WIP):","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":798,"value":"viewof minDate = {\n const dates = data\n .map((d) => d.date)\n .filter((d) => d)\n .sort((a, b) => d3.ascending(+a, +b));\n return Scrubber(dates, {\n delay: 500,\n autoplay: false,\n loop:false,\n initial: dates.length-1\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":703,"value":"viewof nodeSize = Inputs.range([2, 30], {\n label: \"Node Size\",\n value: 5,\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":84,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1339,"value":"viewof useImages = Inputs.toggle({label: \"Use Images\", value: true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":678,"value":"viewof showGroupingNodes = Inputs.toggle({label: \"Show (connecting) grey nodes\", value: false})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":680,"value":"viewof fontSize = Inputs.range([1, 36], {label: \"Font size\", value: 10, step: 1})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1312,"value":"viewof clipLabels = Inputs.toggle({label: \"Clip Labels\", value: true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":705,"value":"viewof greyNodeSize = Inputs.range([1, 30], {label: \"Connecting Node Size\", value: 5, step: 1})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1004,"value":"viewof hullPadding = Inputs.range([0, 100], {label: \"Hull Padding\", value: 10, step: 1})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":774,"value":"viewof minDegree = Inputs.range([0, d3.max(graph.nodes, (d) => d.degree)+1], {\n label: \"Min Degree for Label\",\n value: this !== undefined ? this.value : 1,\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":720,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":747,"value":"viewof useShadowsText = Inputs.toggle({label: \"Use Text Shadows\", value: true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1079,"value":"viewof useShadowsNodes = Inputs.toggle({label: \"Use Node Shadows\", value: true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1494,"value":"viewof excludeKhouryHull = Inputs.toggle({label: \"Exclude Khoury Hull\", value: true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1252,"value":"graph","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":368,"value":"style = html`\n\n\n\n