  {"id":2,"date":"2019-05-09T17:42:27","date_gmt":"2019-05-09T17:42:27","guid":{"rendered":"https:\/\/www.vanderbilt.edu\/evolution\/?page_id=2"},"modified":"2026-03-01T20:14:54","modified_gmt":"2026-03-01T20:14:54","slug":"home","status":"publish","type":"page","link":"https:\/\/www.vanderbilt.edu\/evolution\/","title":{"rendered":"Home"},"content":{"rendered":"<p>Evolutionary concepts are routinely employed to addres<a style=\"color: #000000;border-bottom-color: #d8ab4c\" href=\"https:\/\/www.givecampus.com\/campaigns\/57423\/donations\/new?designation=grandchallengeinitiativeevolutionarystudies&amp;a=9758962\" target=\"_blank\" rel=\"noopener\"><img loading=\"lazy\" class=\"size-medium wp-image-1165 alignright\" src=\"https:\/\/cdn.vanderbilt.edu\/vu-URL\/wp-content\/uploads\/sites\/295\/2021\/12\/20023631\/DONATE-TODAY-1-300x300.png\" alt=\"Donate today with gold background\" width=\"300\" height=\"300\" srcset=\"https:\/\/cdn.vanderbilt.edu\/vu-URL\/wp-content\/uploads\/sites\/295\/2021\/12\/20023631\/DONATE-TODAY-1-300x300.png 300w, https:\/\/cdn.vanderbilt.edu\/vu-URL\/wp-content\/uploads\/sites\/295\/2021\/12\/20023631\/DONATE-TODAY-1-1024x1024.png 1024w, https:\/\/cdn.vanderbilt.edu\/vu-URL\/wp-content\/uploads\/sites\/295\/2021\/12\/20023631\/DONATE-TODAY-1-150x150.png 150w, https:\/\/cdn.vanderbilt.edu\/vu-URL\/wp-content\/uploads\/sites\/295\/2021\/12\/20023631\/DONATE-TODAY-1-768x768.png 768w, https:\/\/cdn.vanderbilt.edu\/vu-URL\/wp-content\/uploads\/sites\/295\/2021\/12\/20023631\/DONATE-TODAY-1.png 1080w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>s health (e.g., drug resistance, cancer), social (e.g., climate change) and economic (e.g., livestock \/ crop improvement) challenges and are at the heart of understanding the human condition and our place in the universe. <strong>By informing our past, our complex behaviors, and our relationship to the natural world, evolution touches on broad reaches of human experience, forming a bridge between the life sciences, the social sciences, and the humanities.<\/strong><\/p>\n<p>The aim of Evolutionary Studies at 天美传媒官网 is to unite a remarkably diverse array of scholars from diverse disciplines with broad interests and expertise in evolution-related fields. Our campus houses scholars that integrate evolution with anthropology, neuroscience, psychological sciences, economics, law, language, paleontology, education, ecology, <img loading=\"lazy\" class=\"alignleft wp-image-1584\" src=\"https:\/\/cdn.vanderbilt.edu\/vu-URL\/wp-content\/uploads\/sites\/295\/2022\/07\/20023352\/ES-black-and-gold-e1657551612542.jpg\" alt=\"Gold Circles connected by black vines. Evolutionary Studies. 天美传媒官网 Logo black and gold\" width=\"251\" height=\"269\" \/><span style=\"font-size: 1.2rem\">and medicine, to name just a few. Evolution <\/span><span style=\"font-size: 1.2rem\">not only provides the scaffold on which many of these fields are built, but its concepts and tools constitute the very means by which we study virtually everything that contains the words \u201chuman\u201d, \u201cbehavior\u201d, \u201cculture\u201d, and increasingly \u201cpolicy\u201d.<\/span><\/p>\n<p>Our initiative is part of the College of Arts and Science Grand Challenge Initiative, where leading faculty are addressing some of the most challenging topics facing the world today. We support diverse activities, including a seminar series, undergraduate and graduate courses, grant writing, trainee career development, and outreach. We welcome any suggestions and requests at <a href=\"mailto:evolutionarystudies@vanderbilt.edu\">evolutionarystudies@vanderbilt.edu.<\/a><\/p>\n<p>&nbsp;<\/p>\n<script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><!-- DO NOT REMOVE --><\/script>\n<!-- ESI Co-Author Network - 3D WordPress Embed -->\r\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/three.js\/r128\/three.min.js\"><\/script>\r\n\r\n<style>\r\n  #esi3-wrap { font-family: inherit; width: 100%; }\r\n  #esi3-wrap * { box-sizing: border-box; }\r\n\r\n  #esi3-header { margin-bottom: 0.75rem; }\r\n  #esi3-title {\r\n    font-size: 1.6rem; font-weight: 700; color: #1a1a2e;\r\n    letter-spacing: 0.01em; line-height: 1.2;\r\n    font-family: Georgia, 'Times New Roman', serif;\r\n  }\r\n  #esi3-title span { font-style: italic; font-weight: 400; color: #4a6fa5; }\r\n  #esi3-subtitle { font-size: 0.8rem; color: #999; margin-top: 0.15rem; letter-spacing: 0.02em; }\r\n\r\n  #esi3-controls { display: flex; gap: 0.6rem; margin-bottom: 0.6rem; flex-wrap: wrap; }\r\n  .esi3-btn {\r\n    background: #fff; border: 1px solid #ccc; border-radius: 20px;\r\n    padding: 0.25rem 0.85rem; font-size: 0.78rem; cursor: pointer;\r\n    font-family: inherit; color: #444; transition: all 0.2s;\r\n  }\r\n  .esi3-btn:hover { background: #1a1a2e; color: #fff; border-color: #1a1a2e; }\r\n  .esi3-btn.active { background: #1a1a2e; color: #fff; border-color: #1a1a2e; }\r\n\r\n  #esi3-canvas-wrap {\r\n    width: 100%; height: 580px; position: relative;\r\n    border-radius: 8px; overflow: hidden;\r\n    background: #0d1117;\r\n    cursor: grab;\r\n  }\r\n  #esi3-canvas-wrap:active { cursor: grabbing; }\r\n  #esi3-canvas { width: 100% !important; height: 100% !important; display: block; }\r\n\r\n  #esi3-tooltip {\r\n    position: fixed; background: rgba(13,17,23,0.92); border: 1px solid rgba(255,255,255,0.12);\r\n    border-radius: 8px; padding: 0.5rem 0.85rem; font-size: 0.78rem;\r\n    pointer-events: none; opacity: 0; transition: opacity 0.15s;\r\n    box-shadow: 0 4px 20px rgba(0,0,0,0.4); max-width: 230px;\r\n    z-index: 9999; font-family: inherit; color: #e0e0e0;\r\n  }\r\n  #esi3-tooltip strong { display: block; margin-bottom: 0.2rem; color: #fff; font-size: 0.88rem; }\r\n  .esi3-tag {\r\n    display: inline-block; border-radius: 10px; padding: 0.1rem 0.45rem;\r\n    font-size: 0.7rem; font-weight: 600; margin-bottom: 0.25rem; color: #1a1a2e;\r\n  }\r\n  .esi3-conns { color: #aaa; font-size: 0.72rem; display: block; }\r\n\r\n  #esi3-legend { display: flex; flex-wrap: wrap; gap: 0.3rem 0.9rem; margin-top: 0.6rem; }\r\n  .esi3-leg {\r\n    display: flex; align-items: center; gap: 0.35rem; font-size: 0.76rem;\r\n    color: #444; cursor: pointer; padding: 0.15rem 0.4rem;\r\n    border-radius: 10px; transition: background 0.15s; font-family: inherit;\r\n  }\r\n  .esi3-leg:hover { background: rgba(0,0,0,0.07); }\r\n  .esi3-swatch { width: 11px; height: 11px; border-radius: 50%; flex-shrink: 0; }\r\n  .esi3-hint { font-size: 0.7rem; color: #aaa; margin-top: 0.35rem; display: block; }\r\n<\/style>\r\n\r\n<div id=\"esi3-wrap\">\r\n  <div id=\"esi3-header\">\r\n    <div id=\"esi3-title\">ESI <span>Co-Author<\/span> Network<\/div>\r\n    <div id=\"esi3-subtitle\">Evolution@Vanderbilt \u00b7 Faculty Research Connections<\/div>\r\n  <\/div>\r\n  <div id=\"esi3-controls\">\r\n    <button class=\"esi3-btn\" id=\"esi3-rotate-btn\">\u27f3 Auto-Rotate<\/button>\r\n    <button class=\"esi3-btn\" id=\"esi3-label-btn\">Toggle Labels<\/button>\r\n    <button class=\"esi3-btn\" id=\"esi3-reset-btn\">Reset View<\/button>\r\n    <button class=\"esi3-btn\" id=\"esi3-clear-btn\">Clear Highlight<\/button>\r\n  <\/div>\r\n  <div id=\"esi3-canvas-wrap\">\r\n    <canvas id=\"esi3-canvas\"><\/canvas>\r\n  <\/div>\r\n  <span class=\"esi3-hint\">Drag to rotate \u00b7 Scroll to zoom \u00b7 Click a node to highlight connections<\/span>\r\n  <div id=\"esi3-legend\"><\/div>\r\n<\/div>\r\n<div id=\"esi3-tooltip\"><\/div>\r\n\r\n<script>\r\n(function () {\r\n\r\nconst COLORS = {\r\n  BSCI:    { hex: '#5DADE2', label: 'Biological Sciences' },\r\n  Medical: { hex: '#E8EAED', label: 'Medical\/Clinical' },\r\n  Anthro:  { hex: '#E74C3C', label: 'Anthropology' },\r\n  EES:     { hex: '#58D68D', label: 'Earth & Environmental Sci.' },\r\n  Biochem: { hex: '#F39C12', label: 'Biochemistry' },\r\n  Chem:    { hex: '#F7DC6F', label: 'Chemistry' },\r\n  Neuro:   { hex: '#B0E0E6', label: 'Neurobiology' },\r\n  BME:     { hex: '#4682B4', label: 'Biomedical Engineering' },\r\n};\r\n\r\nfunction hexToThree(hex) {\r\n  return new THREE.Color(hex);\r\n}\r\n\r\nconst NODES = [\r\n  { id:'Rokas',           dept:'BSCI',    x:  1.5, y:  1,   z:  1,  r:1.0 },\r\n  { id:'Skaar',           dept:'Medical', x:  4.5, y:  1,   z:  1,  r:1.0 },\r\n  { id:'Eichman',         dept:'BSCI',    x: -1,   y:  3,   z:  2,  r:1.0 },\r\n  { id:'Rinker',          dept:'BSCI',    x: -4,   y:  0,   z:  1,  r:1.0 },\r\n  { id:'Creanza',         dept:'BSCI',    x: -1,   y: -3,   z:  2,  r:1.0 },\r\n  { id:'Friedman',        dept:'BSCI',    x:  1,   y:  2,   z: -1,  r:1.0 },\r\n  { id:'Hudson',          dept:'Medical', x:  1,   y: -2,   z: -2,  r:1.0 },\r\n  { id:'Walker',          dept:'Chem',    x:  2,   y:  4,   z:  0,  r:1.0 },\r\n  { id:'Johnson',         dept:'BSCI',    x:  3,   y: -1,   z:  3,  r:1.0 },\r\n  { id:'Zwiebel',         dept:'BSCI',    x: -2,   y: -1,   z:  3,  r:1.0 },\r\n  { id:'Samuels',         dept:'Medical', x:  3,   y:  0,   z: -2,  r:1.0 },\r\n  { id:'Li',              dept:'Medical', x:  5,   y: -2,   z: -1,  r:1.0 },\r\n  { id:'Velez Edwards',   dept:'Medical', x:  2,   y:  1,   z: -4,  r:1.0 },\r\n  { id:'Cover',           dept:'Medical', x:  6,   y:  3,   z:  0,  r:1.0 },\r\n  { id:'Georgiev',        dept:'Medical', x:  6,   y:  0,   z:  2,  r:1.0 },\r\n  { id:'Hadjifrangiskou', dept:'Medical', x:  5,   y:  2,   z:  3,  r:1.0 },\r\n  { id:'Bratton',         dept:'Medical', x:  5,   y:  3,   z: -2,  r:1.0 },\r\n  { id:'Zhu',             dept:'Medical', x:  6,   y: -1,   z: -2,  r:1.0 },\r\n  { id:'Chazin',          dept:'Medical', x:  3,   y:  2,   z:  3,  r:1.0 },\r\n  { id:'Bachmann',        dept:'Chem',    x:  6,   y:  2,   z: -4,  r:1.0 },\r\n  { id:'Hodges',          dept:'Biochem', x: -6,   y:  1,   z:  0,  r:1.0 },\r\n  { id:'Broadie',         dept:'Neuro',   x: -5,   y: -1,   z:  2,  r:1.0 },\r\n  { id:'Castiglione',     dept:'BSCI',    x: -3,   y:  2,   z:  1,  r:1.0 },\r\n  { id:'Hillyer',         dept:'BSCI',    x: -5,   y:  2,   z: -1,  r:1.0 },\r\n  { id:'Tate',            dept:'BSCI',    x: -7,   y:  3,   z: -1,  r:1.0 },\r\n  { id:'Lea',             dept:'BSCI',    x: -2,   y: -5,   z:  1,  r:1.0 },\r\n  { id:'Benn Torres',     dept:'Anthro',  x: -3,   y: -4,   z:  3,  r:1.0 },\r\n  { id:'Tung',            dept:'Anthro',  x:  1,   y: -5,   z: -1,  r:1.0 },\r\n  { id:'DeSantis',        dept:'BSCI',    x:  0,   y: -5,   z:  3,  r:1.0 },\r\n  { id:'Jorge',           dept:'EES',     x:  1,   y: -7,   z:  2,  r:1.0 },\r\n  { id:'Bick',            dept:'Medical', x: -3,   y: -6,   z: -1,  r:1.0 },\r\n  { id:'Bonami',          dept:'Medical', x:  7,   y:  1,   z:  3,  r:1.0 },\r\n  { id:'Gamazon',         dept:'Medical', x:  7,   y: -3,   z:  0,  r:1.0 },\r\n  { id:'Rollins-Smith',   dept:'Medical', x:  2,   y: -3,   z: -4,  r:1.0 },\r\n  { id:'Rubinov',         dept:'BME',     x:  8,   y: -4,   z:  2,  r:1.0 },\r\n  { id:'Behringer',       dept:'BSCI',    x:  4,   y:  4,   z: -3,  r:1.0 },\r\n];\r\n\r\nconst EDGES = [\r\n  ['Bick','Lea'], ['Rokas','Samuels'], ['Rokas','Skaar'], ['Rokas','Velez Edwards'],\r\n  ['Rokas','Walker'], ['Rokas','Zwiebel'], ['Bratton','Johnson'], ['Bratton','Zhu'],\r\n  ['Hudson','Rokas'], ['Hudson','Rollins-Smith'], ['Li','Rokas'], ['Li','Samuels'],\r\n  ['Eichman','Friedman'], ['Eichman','Hudson'], ['Eichman','Rokas'], ['Eichman','Skaar'],\r\n  ['Eichman','Walker'], ['Bachmann','Skaar'], ['Johnson','Rokas'], ['Rinker','Rokas'],\r\n  ['Rinker','Zwiebel'], ['Samuels','Velez Edwards'], ['Hodges','Rinker'], ['Gamazon','Li'],\r\n  ['Gamazon','Rubinov'], ['Skaar','Zhu'], ['Castiglione','Rinker'], ['Castiglione','Rokas'],\r\n  ['Georgiev','Hadjifrangiskou'], ['Georgiev','Skaar'], ['Benn Torres','Creanza'],\r\n  ['Hillyer','Rinker'], ['Hillyer','Tate'], ['Friedman','Rokas'], ['Broadie','Rinker'],\r\n  ['DeSantis','Jorge'], ['DeSantis','Tung'], ['Hadjifrangiskou','Rokas'], ['Hadjifrangiskou','Skaar'],\r\n  ['Behringer','Bratton'], ['Behringer','Johnson'], ['Behringer','Zhu'], ['Creanza','Friedman'],\r\n  ['Creanza','Lea'], ['Creanza','Tung'], ['Bonami','Georgiev'], ['Cover','Hadjifrangiskou'],\r\n  ['Cover','Skaar'], ['Chazin','Cover'], ['Chazin','Eichman'], ['Chazin','Friedman'],\r\n  ['Chazin','Skaar'], ['Chazin','Zhu'],\r\n];\r\n\r\n\r\n\/\/ Build adjacency\r\nconst adj = {};\r\nNODES.forEach(n => adj[n.id] = []);\r\nEDGES.forEach(([a,b]) => { adj[a].push(b); adj[b].push(a); });\r\n\r\nconst nodeById = {};\r\nNODES.forEach(n => nodeById[n.id] = n);\r\n\r\n\/\/ \u2500\u2500 Three.js setup \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\r\nconst wrap    = document.getElementById('esi3-canvas-wrap');\r\nconst canvas  = document.getElementById('esi3-canvas');\r\nconst W = wrap.clientWidth  || 900;\r\nconst H = wrap.clientHeight || 580;\r\n\r\nconst renderer = new THREE.WebGLRenderer({ canvas, antialias: true, alpha: false });\r\nrenderer.setSize(W, H);\r\nrenderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));\r\nrenderer.setClearColor(0x0d1117, 1);\r\n\r\nconst scene  = new THREE.Scene();\r\nconst camera = new THREE.PerspectiveCamera(55, W \/ H, 0.1, 200);\r\ncamera.position.set(0, 0, 22);\r\n\r\n\/\/ Lighting\r\nscene.add(new THREE.AmbientLight(0xffffff, 0.6));\r\nconst dirLight = new THREE.DirectionalLight(0xffffff, 0.8);\r\ndirLight.position.set(10, 15, 10);\r\nscene.add(dirLight);\r\nconst backLight = new THREE.DirectionalLight(0x8888ff, 0.3);\r\nbackLight.position.set(-10, -10, -5);\r\nscene.add(backLight);\r\n\r\n\/\/ \u2500\u2500 Build edges (tubes) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\r\nconst edgeObjects = [];\r\nconst edgeMats = [];\r\n\r\nEDGES.forEach(([a, b]) => {\r\n  const na = nodeById[a], nb = nodeById[b];\r\n  if (!na || !nb) return;\r\n  const start = new THREE.Vector3(na.x, na.y, na.z);\r\n  const end   = new THREE.Vector3(nb.x, nb.y, nb.z);\r\n  const dir   = new THREE.Vector3().subVectors(end, start);\r\n  const len   = dir.length();\r\n  const mid   = new THREE.Vector3().addVectors(start, end).multiplyScalar(0.5);\r\n\r\n  const geo = new THREE.CylinderGeometry(0.08, 0.08, len, 5, 1);\r\n  const mat = new THREE.MeshStandardMaterial({\r\n    color: 0x8a7a6a, transparent: true, opacity: 0.55,\r\n    roughness: 0.8, metalness: 0.0,\r\n  });\r\n  const mesh = new THREE.Mesh(geo, mat);\r\n  mesh.position.copy(mid);\r\n  mesh.quaternion.setFromUnitVectors(\r\n    new THREE.Vector3(0, 1, 0),\r\n    dir.normalize()\r\n  );\r\n  mesh.userData = { a, b };\r\n  scene.add(mesh);\r\n  edgeObjects.push(mesh);\r\n  edgeMats.push(mat);\r\n});\r\n\r\n\/\/ \u2500\u2500 Build nodes (spheres) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\r\nconst sphereGeo = new THREE.SphereGeometry(1, 24, 24);\r\nconst nodeMeshes = [];\r\nconst raycasterTargets = [];\r\n\r\nNODES.forEach(n => {\r\n  const col  = hexToThree(COLORS[n.dept].hex);\r\n  const mat  = new THREE.MeshStandardMaterial({\r\n    color: col, roughness: 0.35, metalness: 0.15,\r\n    transparent: false,\r\n  });\r\n  const mesh = new THREE.Mesh(sphereGeo, mat);\r\n  mesh.scale.setScalar(n.r * 0.55);\r\n  mesh.position.set(n.x, n.y, n.z);\r\n  mesh.userData = { id: n.id, dept: n.dept, baseColor: col.clone() };\r\n  scene.add(mesh);\r\n  nodeMeshes.push(mesh);\r\n  raycasterTargets.push(mesh);\r\n});\r\n\r\n\/\/ \u2500\u2500 Labels (CSS2D-style via canvas overlay) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\/\/ We use a 2D canvas overlay to render text labels projected from 3D positions\r\n\r\nconst labelCanvas  = document.createElement('canvas');\r\nlabelCanvas.style.cssText = 'position:absolute;top:0;left:0;pointer-events:none;width:100%;height:100%';\r\nwrap.style.position = 'relative';\r\nwrap.appendChild(labelCanvas);\r\n\r\nconst lctx = labelCanvas.getContext('2d');\r\nlet labelsVisible = true;\r\n\r\nfunction resizeLabelCanvas() {\r\n  labelCanvas.width  = wrap.clientWidth;\r\n  labelCanvas.height = wrap.clientHeight;\r\n}\r\nresizeLabelCanvas();\r\n\r\nfunction drawLabels() {\r\n  lctx.clearRect(0, 0, labelCanvas.width, labelCanvas.height);\r\n  if (!labelsVisible) return;\r\n\r\n  const w = labelCanvas.width, h = labelCanvas.height;\r\n  lctx.font = '600 11px system-ui, sans-serif';\r\n  lctx.textAlign = 'center';\r\n\r\n  NODES.forEach(n => {\r\n    const mesh = nodeMeshes.find(m => m.userData.id === n.id);\r\n    if (!mesh || mesh.material.opacity < 0.2) return;\r\n\r\n    const pos = new THREE.Vector3(n.x, n.y, n.z);\r\n    pos.project(camera);\r\n\r\n    const sx = (pos.x *  0.5 + 0.5) * w;\r\n    const sy = (pos.y * -0.5 + 0.5) * h;\r\n\r\n    if (pos.z > 1) return; \/\/ behind camera\r\n\r\n    const alpha = mesh.userData.faded ? 0.15 : 1.0;\r\n    lctx.globalAlpha = alpha;\r\n\r\n    \/\/ Shadow\r\n    lctx.fillStyle = 'rgba(0,0,0,0.7)';\r\n    lctx.fillText(n.id, sx + 1, sy + 1);\r\n    \/\/ Text\r\n    lctx.fillStyle = '#ffffff';\r\n    lctx.fillText(n.id, sx, sy);\r\n  });\r\n  lctx.globalAlpha = 1;\r\n}\r\n\r\n\/\/ \u2500\u2500 Orbit controls (manual) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\r\nlet isDragging = false, prevMouse = { x: 0, y: 0 };\r\nlet spherical = { theta: 0.3, phi: Math.PI \/ 2.5, r: 22 };\r\nlet autoRotate = true;\r\nlet targetTheta = spherical.theta;\r\n\r\nfunction updateCamera() {\r\n  camera.position.x = spherical.r * Math.sin(spherical.phi) * Math.sin(spherical.theta);\r\n  camera.position.y = spherical.r * Math.cos(spherical.phi);\r\n  camera.position.z = spherical.r * Math.sin(spherical.phi) * Math.cos(spherical.theta);\r\n  camera.lookAt(0, 0, 0);\r\n}\r\n\r\nwrap.addEventListener('mousedown', e => { isDragging = true; prevMouse = { x: e.clientX, y: e.clientY }; });\r\nwindow.addEventListener('mouseup', () => { isDragging = false; });\r\nwrap.addEventListener('mousemove', e => {\r\n  if (!isDragging) return;\r\n  const dx = e.clientX - prevMouse.x;\r\n  const dy = e.clientY - prevMouse.y;\r\n  spherical.theta -= dx * 0.008;\r\n  spherical.phi   -= dy * 0.008;\r\n  spherical.phi    = Math.max(0.2, Math.min(Math.PI - 0.2, spherical.phi));\r\n  prevMouse = { x: e.clientX, y: e.clientY };\r\n  autoRotate = false;\r\n  document.getElementById('esi3-rotate-btn').classList.remove('active');\r\n});\r\n\r\nwrap.addEventListener('wheel', e => {\r\n  e.preventDefault();\r\n  spherical.r = Math.max(8, Math.min(40, spherical.r + e.deltaY * 0.03));\r\n}, { passive: false });\r\n\r\n\/\/ Touch support\r\nlet lastTouch = null;\r\nwrap.addEventListener('touchstart', e => { lastTouch = e.touches[0]; });\r\nwrap.addEventListener('touchmove', e => {\r\n  e.preventDefault();\r\n  const t = e.touches[0];\r\n  const dx = t.clientX - lastTouch.clientX;\r\n  const dy = t.clientY - lastTouch.clientY;\r\n  spherical.theta -= dx * 0.008;\r\n  spherical.phi   -= dy * 0.008;\r\n  spherical.phi    = Math.max(0.2, Math.min(Math.PI - 0.2, spherical.phi));\r\n  lastTouch = t;\r\n  autoRotate = false;\r\n}, { passive: false });\r\n\r\n\/\/ \u2500\u2500 Raycaster \/ click \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\r\nconst raycaster = new THREE.Raycaster();\r\nconst mouse = new THREE.Vector2();\r\nlet highlightedNode = null;\r\n\r\nfunction getCanvasMouse(e) {\r\n  const rect = canvas.getBoundingClientRect();\r\n  mouse.x =  ((e.clientX - rect.left) \/ rect.width)  * 2 - 1;\r\n  mouse.y = -((e.clientY - rect.top)  \/ rect.height) * 2 + 1;\r\n}\r\n\r\nconst tip = document.getElementById('esi3-tooltip');\r\n\r\nwrap.addEventListener('mousemove', e => {\r\n  if (isDragging) { tip.style.opacity = 0; return; }\r\n  getCanvasMouse(e);\r\n  raycaster.setFromCamera(mouse, camera);\r\n  const hits = raycaster.intersectObjects(raycasterTargets);\r\n  if (hits.length > 0) {\r\n    const id = hits[0].object.userData.id;\r\n    const n  = nodeById[id];\r\n    const conns = adj[id];\r\n    tip.innerHTML = `<strong>${id}<\/strong>\r\n      <span class=\"esi3-tag\" style=\"background:${COLORS[n.dept].hex}\">${COLORS[n.dept].label}<\/span>\r\n      <span class=\"esi3-conns\">${conns.length} connection${conns.length!==1?'s':''}: ${conns.join(', ')}<\/span>`;\r\n    tip.style.opacity = 1;\r\n    tip.style.left = (e.clientX + 14) + 'px';\r\n    tip.style.top  = (e.clientY - 10) + 'px';\r\n    wrap.style.cursor = 'pointer';\r\n  } else {\r\n    tip.style.opacity = 0;\r\n    wrap.style.cursor = isDragging ? 'grabbing' : 'grab';\r\n  }\r\n});\r\n\r\nwrap.addEventListener('click', e => {\r\n  getCanvasMouse(e);\r\n  raycaster.setFromCamera(mouse, camera);\r\n  const hits = raycaster.intersectObjects(raycasterTargets);\r\n  if (hits.length > 0) {\r\n    const id = hits[0].object.userData.id;\r\n    if (highlightedNode === id) { clearHighlight(); return; }\r\n    highlightNode(id);\r\n  } else {\r\n    clearHighlight();\r\n  }\r\n});\r\n\r\nfunction highlightNode(id) {\r\n  highlightedNode = id;\r\n  const nb = new Set([id, ...adj[id]]);\r\n  nodeMeshes.forEach(m => {\r\n    const isMember = nb.has(m.userData.id);\r\n    m.material.transparent = true;\r\n    m.material.opacity = isMember ? 1.0 : 0.05;\r\n    m.userData.faded = !isMember;\r\n  });\r\n  edgeObjects.forEach(l => {\r\n    const connected = nb.has(l.userData.a) && nb.has(l.userData.b);\r\n    l.material.opacity   = connected ? 0.9 : 0.02;\r\n    l.material.color.set(connected ? 0xaaccff : 0x6a8ab0);\r\n  });\r\n}\r\n\r\nfunction clearHighlight() {\r\n  highlightedNode = null;\r\n  nodeMeshes.forEach(m => {\r\n    m.material.transparent = false;\r\n    m.material.opacity = 1.0;\r\n    m.userData.faded = false;\r\n  });\r\n  edgeObjects.forEach(l => {\r\n    l.material.opacity = 0.55;\r\n    l.material.color.set(0x8a7a6a);\r\n  });\r\n}\r\n\r\n\/\/ \u2500\u2500 Controls \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\r\nconst rotateBtn = document.getElementById('esi3-rotate-btn');\r\nrotateBtn.classList.add('active');\r\nrotateBtn.addEventListener('click', () => {\r\n  autoRotate = !autoRotate;\r\n  rotateBtn.classList.toggle('active', autoRotate);\r\n});\r\n\r\ndocument.getElementById('esi3-label-btn').addEventListener('click', () => {\r\n  labelsVisible = !labelsVisible;\r\n});\r\n\r\ndocument.getElementById('esi3-reset-btn').addEventListener('click', () => {\r\n  spherical = { theta: 0.3, phi: Math.PI \/ 2.5, r: 22 };\r\n  autoRotate = true;\r\n  rotateBtn.classList.add('active');\r\n});\r\n\r\ndocument.getElementById('esi3-clear-btn').addEventListener('click', clearHighlight);\r\n\r\n\/\/ \u2500\u2500 Legend \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\r\nconst legendEl = document.getElementById('esi3-legend');\r\nObject.entries(COLORS).forEach(([key, val]) => {\r\n  const item = document.createElement('div');\r\n  item.className = 'esi3-leg';\r\n  item.innerHTML = `<div class=\"esi3-swatch\" style=\"background:${val.hex}\"><\/div>${val.label}`;\r\n  item.addEventListener('click', () => {\r\n    const deptSet = new Set(NODES.filter(n => n.dept === key).map(n => n.id));\r\n    nodeMeshes.forEach(m => {\r\n      const isMember = deptSet.has(m.userData.id);\r\n      m.material.transparent = true;\r\n      m.material.opacity = isMember ? 1.0 : 0.05;\r\n      m.userData.faded = !isMember;\r\n    });\r\n    edgeObjects.forEach(l => {\r\n      l.material.opacity = 0.04;\r\n    });\r\n  });\r\n  legendEl.appendChild(item);\r\n});\r\n\r\n\/\/ \u2500\u2500 Render loop \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\r\nfunction animate() {\r\n  requestAnimationFrame(animate);\r\n  if (autoRotate) spherical.theta += 0.004;\r\n  updateCamera();\r\n  renderer.render(scene, camera);\r\n  drawLabels();\r\n}\r\n\r\nanimate();\r\n\r\n\/\/ Resize\r\nwindow.addEventListener('resize', () => {\r\n  const w = wrap.clientWidth, h = wrap.clientHeight;\r\n  renderer.setSize(w, h);\r\n  camera.aspect = w \/ h;\r\n  camera.updateProjectionMatrix();\r\n  resizeLabelCanvas();\r\n});\r\n\r\n})();\r\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Evolutionary concepts are routinely employed to address health (e.g., drug resistance, cancer), social (e.g., climate change) and economic (e.g., livestock \/ crop improvement) challenges and are at the heart of understanding the human condition and our place in the universe. By informing our past, our complex behaviors, and our relationship to the natural world, evolution&#8230;<\/p>\n","protected":false},"author":399,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"","meta":{"spay_email":""},"tags":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v18.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.vanderbilt.edu\/evolution\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Home - Evolution@Vanderbilt\" \/>\n<meta property=\"og:description\" content=\"Evolutionary concepts are routinely employed to address health (e.g., drug resistance, cancer), social (e.g., climate change) and economic (e.g., livestock \/ crop improvement) challenges and are at the heart of understanding the human condition and our place in the universe. By informing our past, our complex behaviors, and our relationship to the natural world, evolution...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.vanderbilt.edu\/evolution\/\" \/>\n<meta property=\"og:site_name\" content=\"Evolution@Vanderbilt\" \/>\n<meta property=\"article:modified_time\" content=\"2026-03-01T20:14:54+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.vanderbilt.edu\/evolution\/wp-content\/uploads\/sites\/295\/2021\/12\/DONATE-TODAY-1-300x300.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.vanderbilt.edu\/evolution\/#website\",\"url\":\"https:\/\/www.vanderbilt.edu\/evolution\/\",\"name\":\"Evolution@Vanderbilt\",\"description\":\"Evolutionary Studies Initiative at 天美传媒官网\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.vanderbilt.edu\/evolution\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.vanderbilt.edu\/evolution\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/cdn.vanderbilt.edu\/vu-URL\/wp-content\/uploads\/sites\/295\/2021\/12\/20023631\/DONATE-TODAY-1.png\",\"contentUrl\":\"https:\/\/cdn.vanderbilt.edu\/vu-URL\/wp-content\/uploads\/sites\/295\/2021\/12\/20023631\/DONATE-TODAY-1.png\",\"width\":1080,\"height\":1080,\"caption\":\"Donate today with gold background\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.vanderbilt.edu\/evolution\/#webpage\",\"url\":\"https:\/\/www.vanderbilt.edu\/evolution\/\",\"name\":\"Home - Evolution@Vanderbilt\",\"isPartOf\":{\"@id\":\"https:\/\/www.vanderbilt.edu\/evolution\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.vanderbilt.edu\/evolution\/#primaryimage\"},\"datePublished\":\"2019-05-09T17:42:27+00:00\",\"dateModified\":\"2026-03-01T20:14:54+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.vanderbilt.edu\/evolution\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.vanderbilt.edu\/evolution\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.vanderbilt.edu\/evolution\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.vanderbilt.edu\/evolution\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Home\"}]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.vanderbilt.edu\/evolution\/","og_locale":"en_US","og_type":"article","og_title":"Home - Evolution@Vanderbilt","og_description":"Evolutionary concepts are routinely employed to address health (e.g., drug resistance, cancer), social (e.g., climate change) and economic (e.g., livestock \/ crop improvement) challenges and are at the heart of understanding the human condition and our place in the universe. By informing our past, our complex behaviors, and our relationship to the natural world, evolution...","og_url":"https:\/\/www.vanderbilt.edu\/evolution\/","og_site_name":"Evolution@Vanderbilt","article_modified_time":"2026-03-01T20:14:54+00:00","og_image":[{"url":"https:\/\/www.vanderbilt.edu\/evolution\/wp-content\/uploads\/sites\/295\/2021\/12\/DONATE-TODAY-1-300x300.png"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"https:\/\/www.vanderbilt.edu\/evolution\/#website","url":"https:\/\/www.vanderbilt.edu\/evolution\/","name":"Evolution@Vanderbilt","description":"Evolutionary Studies Initiative at 天美传媒官网","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.vanderbilt.edu\/evolution\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https:\/\/www.vanderbilt.edu\/evolution\/#primaryimage","inLanguage":"en-US","url":"https:\/\/cdn.vanderbilt.edu\/vu-URL\/wp-content\/uploads\/sites\/295\/2021\/12\/20023631\/DONATE-TODAY-1.png","contentUrl":"https:\/\/cdn.vanderbilt.edu\/vu-URL\/wp-content\/uploads\/sites\/295\/2021\/12\/20023631\/DONATE-TODAY-1.png","width":1080,"height":1080,"caption":"Donate today with gold background"},{"@type":"WebPage","@id":"https:\/\/www.vanderbilt.edu\/evolution\/#webpage","url":"https:\/\/www.vanderbilt.edu\/evolution\/","name":"Home - Evolution@Vanderbilt","isPartOf":{"@id":"https:\/\/www.vanderbilt.edu\/evolution\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.vanderbilt.edu\/evolution\/#primaryimage"},"datePublished":"2019-05-09T17:42:27+00:00","dateModified":"2026-03-01T20:14:54+00:00","breadcrumb":{"@id":"https:\/\/www.vanderbilt.edu\/evolution\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.vanderbilt.edu\/evolution\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.vanderbilt.edu\/evolution\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.vanderbilt.edu\/evolution\/"},{"@type":"ListItem","position":2,"name":"Home"}]}]}},"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/PbblkY-2","_links":{"self":[{"href":"https:\/\/www.vanderbilt.edu\/evolution\/wp-json\/wp\/v2\/pages\/2"}],"collection":[{"href":"https:\/\/www.vanderbilt.edu\/evolution\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.vanderbilt.edu\/evolution\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.vanderbilt.edu\/evolution\/wp-json\/wp\/v2\/users\/399"}],"replies":[{"embeddable":true,"href":"https:\/\/www.vanderbilt.edu\/evolution\/wp-json\/wp\/v2\/comments?post=2"}],"version-history":[{"count":48,"href":"https:\/\/www.vanderbilt.edu\/evolution\/wp-json\/wp\/v2\/pages\/2\/revisions"}],"predecessor-version":[{"id":3939,"href":"https:\/\/www.vanderbilt.edu\/evolution\/wp-json\/wp\/v2\/pages\/2\/revisions\/3939"}],"wp:attachment":[{"href":"https:\/\/www.vanderbilt.edu\/evolution\/wp-json\/wp\/v2\/media?parent=2"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.vanderbilt.edu\/evolution\/wp-json\/wp\/v2\/tags?post=2"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}