Published
Edited
Dec 8, 2021
1 star
Insert cell
Insert cell
Plot.plot({
marginLeft: 100,
label: null,
color: {
domain: ["Pathological MR", "Normal MR"],
range: ["lightblue", "blue"]
},
x: {
label: "Percent of MRIs",
axis: "top",
domain: [0, 100],
percent: false
},
y: {
ticks: [1, 3],
tickFormat: (i) => ["Pathological MR", "Normal MR"][(i - 1) / 2],
type: "linear"
//paddingInner: 0.5
},
marks: [
Plot.rectX(
csv,
Plot.stackX({
x: "percent_cognitive_impairment",
y: (d) => (d["MR_normal_or_not"] === "Pathological MR" ? 0.99 : 3.01),
stroke: "white",
fill: "lightblue",
interval: 1
})
),
Plot.areaX(
csv,
Plot.stackX({
x: "percent_cognitive_impairment",
y: (d) => (d["MR_normal_or_not"] === "Pathological MR" ? 0.99 : 3.01),
fill: "lightblue",
stroke: "white"
})
)
],
height: 200
})
Insert cell
Plot.plot({
marginLeft: 100,
label: null,
x: {
label: "Percent of MRIs",
axis: "top",
domain: [0, 100],
percent: false
},
y: {
domain: [0, 5]
//paddingInner: 0.5
},
marks: [
Plot.areaX(csv, {
x: "percent_cognitive_impairment",
y1: (d) => d.MR_status_num + 1,
y2: (d) => d.MR_status_num + 2,
fill: "lightblue",
stroke: "white"
}),
Plot.rectX(csv, {
x: "percent_cognitive_impairment",
y1: "MR_status_num",
y2: (d) => d.MR_status_num + 1,
stroke: "white",
fill: "lightblue"
})
],
height: 200
})
Insert cell
csv = aq.fromCSV(`MR_normal_or_not,count,no_of_cognitive_impairment,percent_cognitive_impairment,MR_status_num
Pathological MR,278,100,36,3
Normal MR,132,25,19,1`)
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