Unlisted
Edited
Aug 3, 2023
Insert cell
Insert cell
Type Markdown, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.

Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
// viewof selectedCard = Inputs.select(
// data.map((d) => d.id),
// { value: "1", label: "Select card ID" }
// )
Insert cell
// EmbedCard = {
// const selected = data.find((c) => c["id"] === selectedCard);
// return html`<div class="${slug}-card">
// ${card(selected)}
// </div>
// ${style}`;
// }
Insert cell
// Inputs.textarea({ value: cardEmbedCode, readonly: true, rows: 10 })
Insert cell
// Copier(`Copy single card embed code`, { value: cardEmbedCode })
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
function card(item) {
return html`
<div class="carousel-row">
<div class="title">
<h3>${item.Entity_Country}</h3>
<p class="fecha">${item.date}</p>
<p class="empresa"> Empresa: ${item.company}</p>
</div>
<div class="body">
<div class="description">
<p>${item.Texto}</p>
<p><b>Contenido eliminado:</b> ${item.eliminados}</p>
<p><b>Reporte:</b> ${item.Label} / <a href="{item.Source}" class="alert-link"> ${item.Source}</a>
</div>
</div>
</div>
`;
}
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell

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.
Learn more