Published
Edited
Jun 2, 2021
Plot.plot({
grid: true,
x: {
type: 'log'
},
color: {
type: 'categorical',
scheme: 'set2'
},
marks: [
Plot.dot(data_abs, {
x: 'num_places',
y: 'places_homes',
fill: 'province'
}),
Plot.text(data_abs, {
filter: d => d.places_homes >= 15 || d.num_places >= 10000,
x: 'num_places',
y: 'places_homes',
text: 'city',
title: d => `${d.city}`,
dy: -8
})
]
})
addTooltips(
Plot.dot(data_abs, {
x: 'num_places',
y: 'places_homes',
fill: 'province',
title: d => `${d.city}`
}).plot({ style: { padding: 30, overflow: 'visible' } })
)
import {addTooltips} from "@mkfreeman/plot-tooltip"
Plot.plot({
grid: true,
marginLeft: 50,
marginTop: 50,
marginRight: 50,
color: {
type: 'categorical',
scheme: 'set2'
},
marks: [
Plot.dot(data_mun, {
x: 'Perc_TuristicHousehols',
y: 'Income_Person',
fill: 'province'
}),
Plot.text(data_mun, {
filter: d => d.Perc_TuristicHousehols >= 15 || d.Income_Person >= 20000,
x: 'Perc_TuristicHousehols',
y: 'Income_Person',
text: 'Municipality',
title: d => `${d.Municipality}`,
dy: -8
})
]
})
Plot.plot({
grid: true,
marginLeft: 50,
marginTop: 50,
marginRight: 50,
color: {
type: 'categorical',
scheme: 'set2'
},
marks: [
Plot.dot(data_mun, {
x: 'Perc_TuristicHousehols',
y: 'Rental2020',
fill: 'province'
}),
Plot.text(data_mun, {
filter: d => d.Perc_TuristicHousehols >= 15 || d.Rental2020 >= 1200,
x: 'Perc_TuristicHousehols',
y: 'Rental2020',
text: 'Municipality',
title: d => `${d.Municipality}`,
dy: -8
})
]
})
Plot.plot({
grid: true,
marginLeft: 50,
marginTop: 50,
marginRight: 50,
color: {
type: 'categorical',
scheme: 'set2'
},
marks: [
Plot.dot(data_mun, {
x: 'Perc_TuristicHousehols',
y: 'Population',
fill: 'province'
}),
Plot.text(data_mun, {
filter: d => d.Perc_TuristicHousehols >= 15 || d.Population >= 200000,
x: 'Perc_TuristicHousehols',
y: 'Population',
text: 'Municipality',
title: d => `${d.Municipality}`,
dy: -8
})
]
})
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.
Plot.plot({
grid: true,
marginLeft: 50,
marginTop: 50,
marginRight: 50,
color: {
type: 'categorical',
scheme: 'set2'
},
x: {type: 'log'},
marks: [
Plot.dot(data_mun, {
x: 'Perc_TuristicHousehols',
y: 'Perc_Foreing',
fill: 'province'
}),
Plot.text(data_mun, {
filter: d => d.Perc_TuristicHousehols >= 15 || d.Perc_Foreing >= 35,
x: 'Perc_TuristicHousehols',
y: 'Perc_Foreing',
text: 'Municipality',
title: d => `${d.Municipality}`,
dy: -8
})
]
})
Plot.plot({
grid: true,
marginLeft: 50,
marginTop: 50,
marginRight: 50,
color: {
type: 'categorical',
scheme: 'set2'
},
marks: [
Plot.dot(data_mun, {
x: 'Perc_TuristicHousehols',
y: 'Perc_Older65',
fill: 'province'
}),
Plot.text(data_mun, {
filter: d => d.Perc_TuristicHousehols >= 15 || d.Perc_Older65 >= 37,
x: 'Perc_TuristicHousehols',
y: 'Perc_Older65',
text: 'Municipality',
title: d => `${d.Municipality}`,
dy: -8
})
]
})
Plot.plot({
grid: true,
marginLeft: 50,
marginTop: 50,
marginRight: 50,
color: {
type: 'categorical',
scheme: 'set2'
},
x: {type: 'log'},
marks: [
Plot.dot(data_mun, {
x: 'beds',
y: 'seasonal_population',
fill: 'province'
}),
Plot.text(data_mun, {
filter: d => d.beds >= 13000 || d.seasonal_population >= 20000,
x: 'beds',
y: 'seasonal_population',
text: 'Municipality',
title: d => `${d.Municipality}`,
dy: -8
})
]
})
Inputs.table(data_cs)
Inputs.table(data_mun)
Inputs.table(data_abs)
Inputs.table(data_rel)
data_abs = FileAttachment("dataINE - INE-abs.csv").csv({typed: true})
data_rel = FileAttachment("dataINE - INE-rel.csv").csv({typed: true})
data_mun = FileAttachment("MunicipalData@5.csv").csv({typed: true})
data_cs = FileAttachment("CS_TuristicApartments@1.csv").csv({typed: true})
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.
