Interaction Designer, Creative Technologist, Professor and Researcher
Public
Edited
Jun 15, 2024
Importers
Also listed in…
Componentes
linhadotempo2 = html`<div style='width: 100%; overflow-x: scroll;'>${timelinerMeses(
atividades,
Agrupamento,
25
)}</div>`
linhadotempo3 = html`<div style='width: 100%; overflow-x: scroll;'>${timelinerAnos(
atividades,
"",
40
)}</div>`
html`${timeliner_listaAnos(dadosoriginais)}`
cronoAnos = function (arr, label) {
let colunas = deltaanos(arr).final - deltaanos(arr).inicial + 1;
return colunas;
}
cronoMeses = function (arr, label) {
let colunas = contames(menordata(arr), maiordata(arr)) + 1;
return colunas;
}
dadoscarregados = gsdata(
"https://docs.google.com/spreadsheets/d/1DwFrWE_8oLFejn_zXzU1Fl9HbyOJG3PoarlaDuH2Tc8/edit#gid=444640757"
)
acoes = levantataxos(atividades, "Ação")
tes = html`${timeliner_resume(listalideranca)}`
tes3 = html`${timeliner_cronologia(listalideranca)}`
prioridades_vis_res = function (arr, g) {
let myhtml = `<div class="grid_prioridadesvis">`;
let grupos = levantataxos(arr, g);
for (let i = 0; i < grupos.length; i++) {
let temafazer = false;
for (let k = 0; k < arr.length; k++) {
if (arr[k][g] == grupos[i] && arr[k].Estado != "feito") {
temafazer = true;
}
}
if (temafazer) {
myhtml += `<div class='prioridadesvis_grupo_res'>${grupos[i]}</div><div class='ativ_grupo_res'>`;
for (let k = 0; k < arr.length; k++) {
if (arr[k][g] == grupos[i] && arr[k].Estado != "feito") {
myhtml += `<div>${arr[k].Keywords}</div><div>${arr[k].Atividade}</div>`;
}
}
myhtml += `</div>`;
}
}
myhtml += `</div>`;
return myhtml;
}
teste = html`${prioridades_vis(listaprioridades, "Grupo")}`
bolddata = function (data) {
let xpto = data.replace(/\//gi, " <span class='datafraco'>/</span> ");
return xpto;
}
timeliner_cronologia = function (arr) {
let conta = 0;
let myhtml = "<div class='timeliner-cronologia'>";
let jafoi = "";
for (let z = 0; z < arr.length; z++) {
if (typeof arr[z].Fim == "undefined" || arr[z].Fim == "") {
let qualano1 = arr[z].Inicio; // extraiano
if (qualano1 == jafoi) {
qualano1 =
"<div style='width: 100%; text-align: center; margin-left: -4px;'>●</div>";
}
jafoi = arr[z].Inicio; // extraiano
let inserelinks = "";
if (
typeof arr[z].ProdutosLinksAcoes != "undefined" &&
typeof arr[z].ProdutosLinksAcoes != ""
) {
inserelinks = arr[z].ProdutosLinksAcoes + "<br><br>";
}
let insereevidencias = "";
let evidencias = "";
if (typeof arr[z].Produtos != "undefined" && arr[z].Produtos != "") {
evidencias = arr[z].Produtos.split(",");
if (evidencias.length > 0) {
insereevidencias += `<br><br><div class='timeliner_cronologia_gridprodutos'>`;
for (let n = 0; n < evidencias.length; n++) {
insereevidencias += `<iframe frameborder=0 class='timeliner_evidencia' src='${evidencias[n]}'></iframe>`;
}
insereevidencias += `</div><br><br>`;
}
}
myhtml += `<div class='timeliner_cronologia_ano cronopar${
conta % 2
}'><div style='width: 100%; text-align: center; margin-left: -4px;'>●</div></div><div class='datascronologia'><div class='cronologiadata'>${bolddata(
qualano1
)}</div></div><strong>${arr[z].Titulo}</strong><div>${
arr[z].Atividade
}${insereevidencias}${inserelinks}
</div>`;
conta++;
}
}
let jafoi1 = "";
let jafoi2 = "";
for (let z = 0; z < arr.length; z++) {
if (typeof arr[z].Fim != "undefined" && arr[z].Fim != "") {
let qualano1 = arr[z].Inicio; //extraiano
let qualano2 = arr[z].Fim; // extraiano
if (qualano1 == jafoi1 && qualano2 == jafoi2) {
qualano1 = "";
qualano2 = "";
}
jafoi1 = arr[z].Inicio; // extraiano
jafoi2 = arr[z].Fim; // extraiano
let inserelinks = "";
if (
typeof arr[z].ProdutosLinksAcoes != "undefined" &&
typeof arr[z].ProdutosLinksAcoes != ""
) {
inserelinks = arr[z].ProdutosLinksAcoes + "<br><br>";
}
let insereevidencias = "";
let evidencias = "";
if (typeof arr[z].Produtos != "undefined" && arr[z].Produtos != "") {
evidencias = arr[z].Produtos.toString().split(",");
if (evidencias.length > 0) {
insereevidencias += `<br><br><div class='timeliner_cronologia_gridprodutos'>`;
for (let n = 0; n < evidencias.length; n++) {
insereevidencias += `<iframe frameborder=0 class='timeliner_cronologia_evidencia' src='${evidencias[n]}'></iframe>`;
}
insereevidencias += `</div>`;
}
}
myhtml += `<div class='timeliner_cronologia_ano cronopar${
conta % 2
}'><div style='width: 100%; text-align: center; margin-left: -4px;'>●</div></div><div class='datascronologia'><div class='cronologiadata'>${bolddata(
qualano2
)} <span class='datafraco'>⊢⊣</span> ${bolddata(
qualano1
)}</div></div><strong>${arr[z].Titulo}</strong><div>${
arr[z].Atividade
}${insereevidencias}${inserelinks}<br><br></div>`;
conta++;
}
}
myhtml +=
"<div class='timeliner_cronologia_ano lista_final'><div style='width: 100%; text-align: center; margin-left: -4px;'>●</div></div><div></div><div></div><div></div></div>";
return myhtml;
}
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
