2d:null 2e:["$","title",null,{"children":"Gantt-o-matic | Andres Snitcofsky | Observable"}] 33:T857,chart = { const svg = d3.create("svg") .attr("viewBox", [0, 0, width, height]); svg.append("defs") .selectAll("linearGradient") .data(data.filter(d => d.end !== null)) .join("linearGradient") .attr("id", d => (d.gradientId = DOM.uid("gradient")).id) .attr("gradientUnits", "userSpaceOnUse") .attr("x1", d => x(d.start)) .attr("x2", d => x(d.end)) .call(g => g.append("stop").attr("stop-color", "currentColor")) .call(g => g.append("stop").attr("offset", "100%").attr("stop-color", "#ccc")); const line = svg.append("g") .attr("stroke-width", 2) .selectAll("line") .data(data) .join("line") .attr("stroke", d => d.end === null ? "currentColor" : d.gradientId) .attr("x1", d => x(d.start)) .attr("x2", d => d.end?x(d.end):x(d.start)+1) .attr("y1", d => y(d.name) + 0.5) .attr("y2", d => y(d.name) + 0.5); svg.append("g") .call(xAxis); const label = svg.append("g") .attr("font-family", "sans-serif") .attr("font-size", 10) .attr("text-anchor", "end") .selectAll("text") .data(data) .join("text") .attr("x", d => x(d.start) - 6) .attr("y", d => y(d.name)) .attr("dy", "0.35em") .attr("fill-opacity", d => d.end === null ? null : 0.6) .text(d => d.name); const dot = svg.append("g") .attr("fill", "currentColor") .selectAll("circle") .data(data) .join("circle") .attr("cx", d => d.end?x(d.end):x(d.start)+1) .attr("cy", d => y(d.name) + 0.5) .attr("r", 2); return Object.assign(svg.node(), { update(data) { const t = svg.transition().duration(750); y.domain(data.map(d => d.name)); line.data(data, d => d.name).transition(t) .delay(d => y(d.name)) .attr("y1", d => y(d.name)) .attr("y2", d => y(d.name)); label.data(data, d => d.name).transition(t) .delay(d => y(d.name)) .attr("y", d => y(d.name)); dot.data(data, d => d.name).transition(t) .delay(d => y(d.name)) .attr("cy", d => y(d.name)); } }); }34:T89f,viewof source = { const textarea = html`

start	end	name	obs
1891-01-01		Llega la migración	Mauricio Hirsch
1913-01-01		Tren Provincial	Mauricio Hirsch
1914-01-01		Fin de la Colonia Mauricio	Mauricio Hirsch
1916-01-01		Mauricio Wesintein Recibido de Maestro Rural	Mauricio Hirsch
1918-01-01		Director Escuela N° 6	Mauricio Hirsch
1928-01-01		Nacimiento Marcos	Carlos Casares
1939-01-01		Término de Primaria	Carlos Casares
1940-01-01	1942-01-01	Finalizar 3° año	Pehuajó
1943-01-01	1945-01-01	Finalizar 5° año	Ciudad de Buenos Aires
1945-01-01	1951-01-01	Finalizar Medicina	U.B.A.
1949-01-01		Conscripción	Escuela Lemos
1946-01-01	1948-01-01	E.M.T.A.	V. López
1952-01-01	1953-01-01	Navegación	Fluvial-Ultramar
1953-01-01		Casamiento con Clara	Ciudad de Buenos Aires
1953-01-01	1963-01-01	Consultorio Pediátrico	Saavedra
1954-01-01	1958-01-01	Hospital Pirovano	Ciudad de Buenos Aires
1958-01-01	1961-01-01	Psiquiatría Infantil	Hospital de Clínicas
1961-01-01		Pediatría	Hospital Piñero
1962-01-01	1969-01-01	Psiquiatría	Hospital Piñero-Niños
1963-01-01	1965-01-01	Psiquiatría Infantil	Israel
1969-01-01	1976-01-01	Psiquiatría Hosp. Pirovano	Facultad de Medicina
1976-01-01	1983-01-01	Consultorio Privado	Ciudad de Buenos Aires
1984-01-01	1993-01-01	Psiquiatría	Centro N° 1 - Jubilación
1993-01-01	2020-01-01	Psiquiatría	Ciudad de Buenos Aires
2020-01-01	2021-01-01	Cuarentena	Ciudad de Buenos Aires
`;
  textarea.onkeypress = event => {
    if (event.key !== "Enter" || event.shiftKey || event.altKey || event.metaKey || event.ctrlKey) return;
    let i = textarea.selectionStart;
    let j = textarea.selectionEnd;
    let v = textarea.value;
    if (i === j) {
      let k = 0;
      while (i > 0 && v[--i - 1] !== "\n");
      while (i < j && v[i] === " ") ++i, ++k;
      textarea.value = v.substring(0, j) + "\n" + new Array(k + 1).join(" ") + v.substring(j);
      textarea.selectionStart = textarea.selectionEnd = j + k + 1;
      textarea.dispatchEvent(new CustomEvent("input"));
      event.preventDefault();
    }
  };
  textarea.oninput = () => textarea.style.height = `${textarea.value.match(/^/gm).length * 21 + 8}px`;
  textarea.oninput();
  return textarea;
}35:[{"id":"1acc835864c329186e0e81d42e98e3687965ebb8157df561b70af0ec823f3d2a33b2feae3614f146bfe142be265f3817d3449aef02fd3edcd6113cf80d5a4f5d","href":"https://static.observableusercontent.com/files/1acc835864c329186e0e81d42e98e3687965ebb8157df561b70af0ec823f3d2a33b2feae3614f146bfe142be265f3817d3449aef02fd3edcd6113cf80d5a4f5d","name":"candidates.csv","type":"text/csv","lastModified":1603491004478.039,"size":1027}]
31:{"id":"293fa4b5ab14112a","slug":"gantt-o-matic","title":"Gantt-o-matic","thumbnail":"c2019d7fa768e4a34ec374b4ab85d321ac233267cf85e89be3239e38197da0b1","access_level":"public","create_time":"$D2020-10-23T22:10:04.478Z","update_time":"$D2021-09-24T16:47:02.207Z","view_time":null,"first_public_time":"$D2021-02-18T16:45:35.135Z","fork":{"id":"f798413c39bb88c7","slug":"a-timeline-of-democratic-presidential-candidates","title":"A Timeline of Democratic Presidential Candidates","owner":{"id":"8c2e47252fd4995c","login":"mbostock","name":"Mike Bostock"}},"stars":2,"starred":false,"owner":{"type":"team","id":"82fa28a4bb8e5238","login":"rusosnith","name":"Andres Snitcofsky","avatar_url":"https://avatars-next.observableusercontent.com/3ccaf0a07d8d8892515e52d8675c078e760f47c4bca250ca67026f082cd9f2ee","tier":"pro_2024"},"version":198,"publish_version":198,"role":null,"authored":false,"authors":[{"type":"individual","id":"6af64127e9c2630a","login":"rusosnith","name":"Andres Snitcofsky","avatar_url":"https://avatars-next.observableusercontent.com/2b262ea0f2ac88cc8e7b343d227833840f0f3f16653078effbfb00582801e631","tier":null}],"members":[{"type":"individual","id":"6af64127e9c2630a","login":"rusosnith","name":"Andres Snitcofsky","avatar_url":"https://avatars-next.observableusercontent.com/2b262ea0f2ac88cc8e7b343d227833840f0f3f16653078effbfb00582801e631","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":{"id":"90fa702ebcc1d616","slug":"automagicos","title":"Automagicos","owner":{"id":"82fa28a4bb8e5238","login":"rusosnith","name":"Andres Snitcofsky"}},"type":"notebook","body":{"title":"Gantt-o-matic","cells":[{"id":0,"value":"md`# Gantt-o-matic`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":112,"value":"viewof order = {\n  const options = Object.entries(orders);\n  const form = html`<form style=\"display: flex; font: 12px sans-serif; align-items: center; min-height: 33px;\">Order by <select style=\"margin-left: 0.5em;\" name=\"i\">${options.map(([name]) => Object.assign(html`<option>`, {textContent: name}))}`;\n  form.i.selectedIndex = 1;\n  form.i.onchange = () => form.dispatchEvent(new CustomEvent(\"input\"));\n  form.oninput = () => form.value = options[form.i.selectedIndex][1];\n  form.oninput();\n  return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":102,"value":"legend = {\n  const arrowId = DOM.uid(\"arrow\");\n  const gradientId = DOM.uid(\"gradient\");\n  return svg`<svg width=\"180\" height=\"33\" style=\"display: block; font: 10px sans-serif;\">\n  <defs>\n    <linearGradient id=\"${gradientId.id}\" gradientUnits=\"userSpaceOnUse\" x1=\"33\" x2=\"149\">\n      <stop stop-color=\"currentColor\"></stop>\n      <stop stop-color=\"#ccc\" offset=\"100%\"></stop>\n    </linearGradient>\n  </defs>\n  <path fill=\"none\" stroke=\"${gradientId}\" stroke-width=\"2\" d=\"M33,17L149,17\"></path>\n  <circle cx=\"149\" cy=\"17\" r=\"2.5\"></circle>\n  <text x=\"27\" y=\"17\" dy=\"0.35em\" text-anchor=\"end\">Start</text>\n  <text x=\"157\" y=\"17\" dy=\"0.35em\" text-anchor=\"start\">End</text>\n</svg>`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":167,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":135,"value":"chart.update(data.slice().sort(order))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"data = d3.tsvParse(source, d3.autoType).sort(orders.End)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":140,"value":"orders = ({\n  Start: (a, b) => d3.ascending(a.start, b.start),\n  End: (a, b) => d3.descending(a.end || today, b.end || today) || d3.descending(a.start, b.start),\n  Duration: (a, b) => d3.descending((a.end || today) - a.start, (b.end || today) - b.start)\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":116,"value":"today = new Date()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"x = d3.scaleUtc()\n    .domain([d3.min(data, d => d.start), today])\n    .rangeRound([margin.left, width - margin.right])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"y = d3.scalePoint()\n    .domain(data.map(d => d.name))\n    .rangeRound([margin.top, height - margin.bottom])\n    .padding(1)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"xAxis = g => g\n    .attr(\"transform\", `translate(0,${margin.top})`)\n    .call(d3.axisTop(x).ticks(width / 80))\n    .call(g => g.select(\".domain\").remove())\n    .call(g => g.append(\"g\")\n        .attr(\"stroke\", \"white\")\n        .attr(\"stroke-width\", 2)\n      .selectAll(\"line\")\n      .data(x.ticks())\n      .join(\"line\")\n        .attr(\"x1\", d => 0.5 + x(d))\n        .attr(\"x2\", d => 0.5 + x(d))\n        .attr(\"y2\", height - margin.bottom - margin.top))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"margin = ({top: 30, right: 10, bottom: 0, left: 70})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"height = 540","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"d3 = require(\"d3@5\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":169,"value":"html`<style>\n\ntextarea {\n  display: block;\n  boxSizing: border-box;\n  width: calc(100% + 28px);\n  font: var(--mono_fonts);\n  minHeight: 33px;\n  border: none;\n  padding: 4px 10px;\n  margin: 0 -14px;\n  background: rgb(247,247,249);\n  tabSize: 2;\n}\n\ntextarea:focus {\n  outline: none;\n}\n\n</style>`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}}
32:"$31:body"
</article></body></html>