Public
Edited
Jan 30, 2023
1 star
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
minWidth = 400
Insert cell
chartWidth = width / 2.1 < minWidth ? width : width / 2.1
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
variantsToShow
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
deltaDataFiltered
Insert cell
variantPercentPlot = function(variant, smooth = false, facet = false, showLines = "none", showPoints = "for all"){
let variantMetric = smooth ? variant + smoothing : variant;
let metric = smooth ? variant + "_N_Gene" + smoothing : variant + "_N_Gene"
let plotObj = {
marks: [
Plot.frame({strokeWidth: 2, stroke: variantColors.get(variant)}),
Plot.ruleY([1], {strokeDasharray: "2,2"}),
showLines == "for all" ? Plot.line(deltaDataFiltered, {
filter: d => !plantstohighlight.includes(d.Plant),
x: "date",
y: d => d[metric],
stroke: facet ? "#555" : "#aaa",
z: "Plant",
strokeOpacity: facet ? .9 : .5,
}) : null,
["for all", "for highlighted locations only"].includes(showLines) ? Plot.line(deltaDataFiltered, {
filter: d => plantstohighlight.includes(d.Plant),
x: "date",
y: d => d[metric],
r: 5,
stroke: d => plantColors.get(d.Plant),
strokeOpacity: .9,
z: "Plant",
sort: d => d.date
}) : null,
showPoints == "for all" ? Plot.dot(deltaDataFiltered, {
filter: d => !plantstohighlight.includes(d.Plant),
x: "date",
y: d => d[metric],
r: 3,
fill: facet ? "#555" : "#aaa",
fillOpacity: facet ? .9 : .5,
symbol: d => d[metric] < ymax ? "circle" : "triangle",
title: d => d.Plant + "\n" + d.dateformatted + "\n" + variantMetric + " / N gene: " + d3.format(".0%")(d[metric])
}) : null,
["for all", "for highlighted locations only"].includes(showPoints) ? Plot.dot(deltaDataFiltered, {
filter: d => plantstohighlight.includes(d.Plant),
x: "date",
y: d => d[metric],
r: 5,
fill: d => plantColors.get(d.Plant),
fillOpacity: .9,
stroke: "black",
strokeWidth: 1,
symbol: d => d[metric] < ymax ? "circle" : "triangle",
title: d => d.Plant + "\n" + d.dateformatted + "\n" + variant + " / N gene: " + d3.format(".0%")(d[metric])
}) : null
],
y: {
tickFormat: d3.format(".0%"),
domain: [0, ymax],
clamp: true,
label: variantNames.get(variant) + " / N Gene" + (smoothPoints ? " (5-day trimmed mean)" : "")
},
x: {
label: "date of sample taken →"
},
width: chartWidth,
height: chartWidth * .5,
};
if(facet){
plotObj.facet = {
data: deltaDataFiltered,
y: "Plant",
label: null,
marginRight: 24
};
plotObj.fy = {
padding: .2,
tickRotate: 90,
};
plotObj.marginRight = 20;
plotObj.width = Math.min(width / 2.2, 600);
plotObj.height = plantstoshow.length * 220;
};
return Plot.plot(plotObj)
}
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
parseData = (d) => {
d.datetime = d.Date.replace(' ', 'T')
if (new Date(d.datetime) >= new Date(earliestDate)) {
let r = {
date: timeParse(d.datetime.substring(0, 10)),
dateformatted: d.datetime.substring(0, 10)
};
metrics.forEach((metric) => (r[metric + smoothing] = +d[metric + smoothing]));
metrics.forEach((metric) => (r[metric] = +d[metric]));
r["Plant"] = d.Plant;
return r;
}
}
Insert cell
earliestDate = timeFormat(earliestDateUnformatted)
Insert cell
earliestDateUnformatted = d3.timeDay.offset(new Date(), -(7 * num_weeks))
Insert cell
smoothing = "_trimmed5"
Insert cell
metrics = variantsToShow.reduce(
(p, c) => p.concat([c + '_PMMoV', c + '_N_Gene', c + '_gc_g_dry_weight']),
["N_PMMoV"]
)
Insert cell
deltaData = d3.csv(url, parseData)
Insert cell
deltaDataFiltered[3032]
Insert cell
deltaDataFiltered = deltaData.filter(d => plantstoshow.includes(d.Plant))
Insert cell
d3.csv(url)
Insert cell
plantColors = new Map(Plants.map((d,i) => [d, colors[i]]))
Insert cell
colors = ["#5b859e","#1e395f","#75884b","#1e5a46","#df8d71","#af4f2f","#d48f90","#732f30","#ab84a5","#59385c","#d8b847","#b38711"]
Insert cell
variantColors = new Map(
variantsToShowAndNormalized.map(ob => {
return [ob, metricsMeta[ob].color]
})
)
Insert cell
variantNames = new Map(
variantsToShowAndNormalized.map(ob => {
return [ob, metricsMeta[ob].label]
})
)
Insert cell
variantsToShowAndNormalized =
variantsToShow.concat(variantsToShow.map(a => a + "_PMMoV"))
Insert cell
variantsToShow = [
"Delta_156157",
"Del_143145",
"BA_2_LPPA24S",
"BA_4_ORF1a_Del_141143",
"HV_6970_Del",
"BA_2_75_S_147E_S_152R",
"XBB_bkpt", // XBB
]
Insert cell
Plants = [...new Set(["Palo Alto", "San Jose", "Sunnyvale","Gilroy", "Silicon Valley", "Sacramento", "Oceanside", "CODIGA", "Southeast San Francisco"])]
Insert cell
import { url, cutoffDates, timeFormat, timeParse, metricsMeta } from "6c55536820c54786"
Insert cell
import {textcolor} from "@observablehq/text-color-annotations-in-markdown"

Insert cell
import {addTooltips} from "@mkfreeman/plot-tooltip"
Insert cell
todo: check date handling
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