Public
Edited
Apr 15, 2023
Insert cell
Insert cell
Insert cell
Insert cell
data = d3.csv('https://raw.githubusercontent.com/mattroumaya/mufonbot/master/data_raw/links.csv')
Insert cell
// get random row from array
function selectRandom(data) {
data = data[Math.floor(Math.random() * data.length)];
return {
City: data.City,
State: data.State,
Country: data.Country,
Shape: data.Shape,
Duration: data.Duration,
Summary: data.Summary,
Posted: data.Posted,
Image: data.Image,
URL: data.URL,
imageURL: data.image_url,
messageHeader: `NUFORC Report For ${data.City}, ${data.State} (${data.Country}) on ${data.Posted}`
}
}
Insert cell
selected = selectRandom(data)
Insert cell
function addHeader(data) {
// add header
let header = document.querySelector(".header")
header.innerHTML = data.messageHeader

// add content
let shape = document.querySelector(".shape")
shape.innerHTML = `Shape: ${data.Shape}`

// add duration
let duration = document.querySelector(".duration")
duration.innerHTML = `Duration: ${data.Duration}`

// add summary
let summary = document.querySelector(".summary")
summary.innerHTML = `Summary: "${data.Summary}"`

// add image
document.getElementById("ufo-img").src=`${data.imageURL}`;

// raw link
let rawLink = document.querySelector(".raw-link")
rawLink.href = data.imageURL

// raw report link
let rawReportLink = document.querySelector(".report-link")
rawReportLink.href = data.URL

}
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