2e:null 2f:["$","title",null,{"children":"Espiral Arqueológica com Mapa | Papa Dado | Observable"}] 34:T5a7,map = { const div = html`

`; // Cria mapa inicial com zoom controlado const m = L.map(div, {zoomControl: true}).setView([-14.235, -51.9253], 4); // Ajusta o tamanho do mapa após renderização requestAnimationFrame(() => { m.invalidateSize(); }); // Camadas disponíveis const baseLayers = { "Mapa Padrão": L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", { attribution: '© OpenStreetMap contributors' }), "Satélite (Esri)": L.tileLayer("https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}", { attribution: 'Tiles © Esri — Source: Esri, Earthstar Geographics' }) }; // Adiciona camada padrão baseLayers["Mapa Padrão"].addTo(m); // Controle para alternar camadas L.control.layers(baseLayers).addTo(m); // Botão Reset Zoom const resetZoom = L.control({position: 'bottomright'}); resetZoom.onAdd = function() { const btn = L.DomUtil.create('button', ''); btn.innerHTML = '⟳ Reset'; btn.style.padding = '6px 10px'; btn.style.background = '#fff'; btn.style.border = '1px solid #ccc'; btn.style.cursor = 'pointer'; btn.style.borderRadius = '6px'; btn.onclick = () => m.setView([-14.235, -51.9253], 4); return btn; }; resetZoom.addTo(m); return Object.assign(div, {map: m}); } 35:Tce4,svg = { const width = 500, height = 550; // aumentei a altura para dar espaço à legenda const svg = d3.create("svg") .attr("width", width) .attr("height", height) .style("background", "#fafafa"); const g = svg.append("g") .attr("transform", `translate(${width / 2}, ${height / 2 - 30})`); // subiu a espiral para abrir espaço // Escala de cores arqueológica const color = d3.scaleSequential() .domain([30000, 5000]) .interpolator(d3.interpolateRgbBasis([ "#3E2723", // mais antigo "#8B5E3C", "#C19A6B", "#F0E3D0" // mais recente ])); // Zoom interativo const zoom = d3.zoom() .scaleExtent([0.5, 5]) .on("zoom", (event) => { g.attr("transform", `translate(${width / 2}, ${height / 2 - 30}) scale(${event.transform.k})`); }); svg.call(zoom); // Espiral fixa const a = 3, deltaTheta = 0.35; // Tooltip const tooltip = d3.select("body").append("div") .style("position", "absolute") .style("background", "rgba(50,50,50,0.8)") .style("color", "white") .style("padding", "6px 8px") .style("border-radius", "6px") .style("font-size", "12px") .style("display", "none"); dados_filtrados.forEach((d, i) => { const theta = i * deltaTheta; const r = a + i * 4; // espaçamento fixo d.x = r * Math.cos(theta); d.y = r * Math.sin(theta); }); g.selectAll("circle") .data(dados_filtrados) .enter() .append("circle") .attr("cx", d => d.x) .attr("cy", d => d.y) .attr("r", 6) .attr("fill", d => color(d.Conventional_date_BP)) .style("cursor", "pointer") .on("mouseover", (event, d) => { tooltip.style("display", "block") .html(`${d.identifica_x}
${d.Conventional_date_BP} anos AP`); }) .on("mousemove", (event) => { tooltip.style("top", `${event.pageY + 10}px`) .style("left", `${event.pageX + 10}px`); }) .on("mouseout", () => tooltip.style("display", "none")) .on("click", (event, d) => { if (d.latitude && d.longitude) { map.map.setView([d.latitude, d.longitude], 6); L.marker([d.latitude, d.longitude]) .addTo(map.map) .bindPopup(`${d.identifica_x}
${d.Conventional_date_BP} anos AP`) .openPopup(); } }); // ✅ Legenda ajustada para mais abaixo const legendY = height - 40; // posição vertical da legenda const legend = svg.append("g").attr("transform", `translate(${width/2 - 100}, ${legendY})`); const grad = svg.append("defs") .append("linearGradient") .attr("id", "legendGradient") .attr("x1", "0%").attr("y1", "0%") .attr("x2", "100%").attr("y2", "0%"); grad.append("stop").attr("offset", "0%").attr("stop-color", "#3E2723"); grad.append("stop").attr("offset", "50%").attr("stop-color", "#C19A6B"); grad.append("stop").attr("offset", "100%").attr("stop-color", "#F0E3D0"); legend.append("rect") .attr("width", 200) .attr("height", 15) .style("fill", "url(#legendGradient)"); legend.append("text").attr("x", 0).attr("y", -5).text("Mais antigo").style("font-size", "12px"); legend.append("text").attr("x", 200).attr("y", -5).text("Mais recente").style("font-size", "12px").attr("text-anchor", "end"); return svg.node(); } 36:T42e,layout = htl.html`

🌀 30 mil anos de história humana: os sítios arqueológicos mais antigos do Brasil

Clique nos pontos da espiral para ver a localização no mapa.

Espiral

${svg}

Mapa

${map}

`; 37:[{"id":"dfed0f100268988041c525dd5fa70131097f8e99695f435e92be7da86967fe4cd54297248bf2def4030723c11827b58c6463627fca666d7d9dd20a6f8dd21720","href":"https://static.observableusercontent.com/files/dfed0f100268988041c525dd5fa70131097f8e99695f435e92be7da86967fe4cd54297248bf2def4030723c11827b58c6463627fca666d7d9dd20a6f8dd21720","name":"sitios_unicos@1.csv","type":"text/csv","lastModified":1753389996126.422,"size":172723}] 32:{"id":"7dfac0beeae5aa9a","slug":"espiral-arqueologica-com-mapa","title":"Espiral Arqueológica com Mapa","thumbnail":"49e3b8e7b5c25c76853ac31b4ed41e895e2facb91573182f4e68e995d0ccb899","access_level":"public","create_time":"$D2025-07-24T20:18:50.869Z","update_time":"$D2025-07-24T22:43:12.089Z","view_time":null,"first_public_time":"$D2025-07-24T21:18:05.749Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"f3ab8236d5efe960","login":"papa-dado","name":"Papa Dado","avatar_url":"https://avatars-next.observableusercontent.com/98e7be7fe570ede7e2b12d7eef497e2793b50d5198532b2b6995b91179773dec","tier":"starter_2024"},"version":155,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"b4712f2d41ded884","login":"lisi-muller","name":"Lisi Müller","avatar_url":"https://avatars-next.observableusercontent.com/14838b3f8cf5c97d837470c3b3f0ed745cee94b756f7812deb621500c2b74dab","tier":null}],"members":[{"type":"individual","id":"b4712f2d41ded884","login":"lisi-muller","name":"Lisi Müller","avatar_url":"https://avatars-next.observableusercontent.com/14838b3f8cf5c97d837470c3b3f0ed745cee94b756f7812deb621500c2b74dab","tier":null,"role":"editor"},{"type":"team","id":"f3ab8236d5efe960","login":"papa-dado","name":"Papa Dado","avatar_url":"https://avatars-next.observableusercontent.com/98e7be7fe570ede7e2b12d7eef497e2793b50d5198532b2b6995b91179773dec","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Espiral Arqueológica com Mapa","cells":[{"id":4,"value":"# Espiral Arqueológica com Mapa","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":67,"value":"d3 = require(\"d3@7\")\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"L = require(\"leaflet@1.9.4\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"sitios_unicos1 = await FileAttachment(\"sitios_unicos@1.csv\").csv({typed: \"auto\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"sitios_unicos1","database":"$undefined"},{"id":30,"value":"dados = FileAttachment(\"sitios_unicos@1.csv\").csv({typed: true})\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"dados_filtrados = (estado === \"Todos\")\n ? dados.filter(d => d.Conventional_date_BP >= 5000 && d.Conventional_date_BP <= 30000)\n : dados.filter(d => d.Conventional_date_BP >= 5000 && d.Conventional_date_BP <= 30000 && d.state_enco === estado);\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":129,"value":"$34","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":138,"value":"$35","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":124,"value":"$36","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":82,"value":"layout.querySelector(\"#espiral-slot\").appendChild(svg)\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":84,"value":"layout.querySelector(\"#map-slot\").appendChild(map)\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":90,"value":"{\n const slot = layout.querySelector(\"#espiral-slot\");\n slot.innerHTML = \"\"; // Limpa qualquer SVG anterior\n slot.appendChild(svg);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":92,"value":"{\n const slot = layout.querySelector(\"#map-slot\");\n slot.innerHTML = \"\";\n slot.appendChild(map);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":152,"value":"viewof estado = Inputs.select(\n [\"Todos\", ...new Set(dados.map(d => d.state))],\n {label: \"Filtrar por Estado\", value: \"Todos\"}\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W37","stdlib":"1","titling":"auto"}} 33:"$32:body"