selectedProperties
Type Table, then Shift-Enter. Ctrl-space for more options.
Plot.plot({
grid: true,
inset: 10,
width: 900,
height: 1200,
marginLeft: 100,
color: {
legend: true
},
x: {
domain: [0, 2000000]
},
marks: [
Plot.boxX(selectedProperties, {
y: "transportationNearest",
x: "pricePerMeter"
})
]
})
selectedComparedProperties = selectedProperties.map((p) => {
p["pricePerFloor"] = (p.pricePerMeter * 100) / p.floorAreaPercent;
return p;
})
Plot.plot({
grid: true,
inset: 10,
width: 900,
height: 500,
marginLeft: 100,
color: {
legend: true
},
y: {
domain: [0, 1500000]
},
marks: [
Plot.boxY(selectedSales, {
x: "year",
y: "pricePerMeter",
stroke: "floorAreaPercent"
}),
Plot.dot(selectedSales, {
x: "year",
y: "pricePerMeter",
stroke: "floorAreaPercent"
})
]
})
Plot.plot({
grid: true,
inset: 10,
marginLeft: 100,
color: {
legend: true
},
x: {
domain: [0, 20]
},
y: {
domain: [0, 1500000]
},
marks: [
Plot.dot(selectedSales, {
x: "transportationDistanceMins",
y: "pricePerFloor",
stroke: "area"
}),
Plot.dot(selectedComparedProperties, {
x: (p) => p.transportationDistanceMeter / 80,
y: "pricePerFloor",
stroke: "#000"
}),
Plot.linearRegressionY(selectedSales, {
x: "transportationDistanceMins",
y: "pricePerFloor",
stroke: "area",
ci: 0.95
}),
Plot.linearRegressionY(selectedComparedProperties, {
x: (p) => p.transportationDistanceMeter / 80,
y: "pricePerFloor",
stroke: "#000",
ci: 0.95
})
]
})
Plot.plot({
grid: true,
inset: 10,
marginLeft: 100,
color: {
legend: true
},
x: {
domain: [0, 20]
},
y: {
domain: [0, 1500000]
},
marks: [
Plot.dot(selectedSales, {
x: "transportationDistanceMins",
y: "pricePerMeter",
stroke: "#f33"
}),
Plot.dot(selectedComparedProperties, {
x: (p) => p.transportationDistanceMeter / 80,
y: "pricePerMeter",
stroke: "#000"
}),
Plot.linearRegressionY(selectedSales, {
x: "transportationDistanceMins",
y: "pricePerMeter",
stroke: "#f33",
ci: 0.95
}),
Plot.linearRegressionY(selectedComparedProperties, {
x: (p) => p.transportationDistanceMeter / 80,
y: "pricePerMeter",
stroke: "#000",
ci: 0.95
})
]
})
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.
