Public
Edited
Sep 11, 2023
words = ["datasets", "javascript", "chart", "graph", "visualization", "cleaning"]
//return all ocurences in array
words.filter(word => word.length > 6)
//returns first occurence
words.find(word => word.length > 6)
words.sort()
population = [
{"city":"seattle", "state":"WA", "population":652405, "land_area":83.9},
{"city":"new york", "state":"NY", "population":8405837, "land_area":302.6},
{"city":"boston", "state":"MA", "population":645966, "land_area":48.3},
{"city":"kansas city", "state":"MO", "population":467007, "land_area":315}
]
population.filter(obj => obj.population > 500000)
{
population.forEach(obj => obj.city = capitalizeFirstLetter(obj.city))
return population
}
population
function capitalizeFirstLetter(str){
let words = String(str).split(" ");
let newWords = [];
words.forEach(word => newWords.push( word.charAt(0).toUpperCase() + word.slice(1) ) )
return newWords.join(" ")
}
//oututs new array - changed proerties, etc
mapped = population.map(obj => {
//some manipulation here
return {
"location": capitalizeFirstLetter(obj.city) + ", "+ obj.state,
"population": Number(obj.population)
}
})
reducer = (accumulator, currentValue) => accumulator + currentValue;
nums = [1, 2, 3, 4]
{
let arr = nums;
arr = arr.reduce(reducer) // 1 + 2 + 3 + 4
return arr
}
output = nums.reduce(reducer, 5) // 1 + 2 + 3 + 4 + 5
totalPop = mapped.reduce((sum, d) => Number(sum) + Number(d.population), [])
minPop = mapped.reduce((prev, curr) => prev.population < curr.population ? prev : curr)
/*
minPop = mapped.reduce((function(prev, curr) {
return prev.population < curr.population ? prev : curr
})
*/
maxPop = mapped.reduce((prev, curr)=> prev.population > curr.population ? prev : curr)
penguins
Inputs.table(penguins)
pollenData = FileAttachment("PollenHistoryCountCABQ-en-us.csv").csv({typed:true})
Inputs.table(pollenData)
Wrangler(pollenData)
// To use copied code replace "data" with your own variable
aq.from(pollenData)
.groupby('READING_DATE','Location','POLLEN_NAME')
.rollup({min:d => op.min(d["READING_VALUE"]),
max:d => op.max(d["READING_VALUE"]),
sum:d => op.sum(d["READING_VALUE"])})
.orderby("READING_DATE")
.objects() // Uncomment to return an array of objects
min = d3.min(pollenData, d => d.READING_VALUE)
max = d3.max(pollenData, d => d.READING_VALUE)
mean = d3.mean(pollenData, d => d.READING_VALUE)
median = d3.median(pollenData, d => d.READING_VALUE)
d3.sort(pollenData, d => d.READING_VALUE)
pollenData.slice().sort((a, b) => d3.descending(a.READING_VALUE, b.READING_VALUE))
totalPollen = d3.sum(pollenData, d=> d.READING_VALUE)
totalMulburry = d3.sum(pollenData.filter(d => d.POLLEN_NAME == "Mulberry"), d => d.READING_VALUE)
groupdByDay = d3.group(pollenData, d => d.READING_DATE)
totalPollenByDay = d3.rollup(
pollenData,
data => d3.sum(data, d=> d.READING_VALUE),
d => d.READING_DATE
)
types = pollenData.map(d=>d.POLLEN_NAME)
uniquetypes = types.filter((curr, idx, arr) => idx == arr.indexOf(curr) )
mappedPollenData = pollenData.map(d => {
//strip white space
d.POLLEN_NAME = (d.POLLEN_NAME).trim()
//fix typos
if (d.POLLEN_NAME == "Unidentied"){
d.POLLEN_NAME = "Unidentified"
}
if (d.POLLEN_NAME.includes("Scorpion Weed")){
d.POLLEN_NAME = "Scorpion Weed"
}
//remove object
if (d.POLLEN_NAME === "Equipment Error" || d.POLLEN_NAME === "End of Season" || d.POLLEN_NAME === "Pollen Count Unavailable" || d.POLLEN_NAME == ""){
let idx = pollenData.indexOf(d); //index pos in the array
pollenData.splice(idx,1) //remove obj at that position
}
return d
})
dataset = {
return {
"title": "Abq Public Data - Pollen",
"min": min,
"max": max,
"data": mappedPollenData
}
}
viewof select = Inputs.select([...(dataset.data).map(d => d.POLLEN_NAME)], {label: "select ttype", sort: true, unique: true})
select
filteredData = (dataset.data).filter( d => d.POLLEN_NAME == select)
Plot.plot({
grid: true,
y: {
domain: [dataset.min, dataset.max]
},
marks: [
Plot.dot(filteredData, {x: "READING_DATE", y: "READING_VALUE", fill: "POLLEN_NAME"})
]
})
mappedPollenData
X
READING_DATE
Y
READING_VALUE
Color
POLLEN_NAME
Size
READING_VALUE
Facet X
—
Facet Y
—
Mark
Auto
Type Chart, then Shift-Enter. Ctrl-space for more options.
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.
