To boldly geo where no-one has geo'd before
Public
Edited
Feb 26, 2024
1 fork
scale = d3.scaleLinear().domain([
d3.min(temp,d=>d.temp),
d3.max(temp,d=>d.temp)
]).range([0,0.9])
longitude = d3.scalePoint([1,2,3,4,5,6,7,8,9,10,11,12], [180, -180]).padding(0.5).align(1)
Plot.plot({
width: 1200,
height: 1200,
color: {
scheme: "viridis"
},
projection: {
type: "azimuthal-equidistant",
rotate: [0, -90],
// Note: 0.625° corresponds to max. length (here, 0.5), plus enough room for the labels
domain: d3.geoCircle().center([0, 90]).radius(1)()
},
//width: 1200,
marks:[
// discs
Plot.geo([1.0,0.9,0.8,0.7,0.6,0.5, 0.4, 0.3, 0.2, 0.1], {
geometry: (r) => d3.geoCircle().center([0, 90]).radius(r)(),
stroke: "black",
fill: "none",
strokeOpacity: 0.3,
fillOpacity: 0.03,
strokeWidth: 0.5
}),
// white axes
Plot.link(longitude.domain(), {
x1: longitude,
y1: 90 - 2,
x2: 0,
y2: 90,
stroke: "lightgrey",
strokeOpacity: 0.5,
strokeWidth: 1
}),
Plot.line(temp, {
x: d=> longitude(d.month),
y: d=> 90 - scale(d.temp),
fill: "none",
stroke: "year",
opacity: 0.5
//curve: "cardinal-closed",
}),
Plot.dot(temp, {
x: d=> longitude(d.month),
y: d=> 90 - scale(d.temp),
fill: "year",
r: 2,
stroke: "white",
strokeWidth: 0.5,
title: d=>d.year + ' ' + d.month
}),
Plot.line([1,2,3,4,5,6,7,8,9,10,11,12],{
x: d=>Math.sin( (d/12.0 ) * 2 * Math.PI ),
y: d=>Math.cos( (d/12.0 ) * 2 * Math.PI ),
stroke: 'black',curve: "catmull-rom"
})
/*
Plot.line(temp, {x: 'date', y: 'daytemp',stroke: 'grey'}),
Plot.line(temp, {x: 'date', y: 'maxdaytemp',stroke: 'darkred'}),
Plot.line(temp, {x: 'date', y: 'mindaytemp',stroke: 'steelblue'}),
*/
]})
Plot.line(temp,{x: 'date',y: 'temp', stroke: 'year'}).plot()
Plot.plot({
color:{
legend: true
},
marks: [
Plot.dot(temp, {x: 'temp', y: 'precip', opacity: 0.01})
]})
temp = data.query(`
SELECT
date_trunc('month',strptime(YYYYMMDD, '%Y%m%d')) as date,
date_part('month',strptime(YYYYMMDD, '%Y%m%d')) as month,
date_part('year',strptime(YYYYMMDD, '%Y%m%d')) as year,
avg(TG)/10.0 + 1 AS temp,
avg(TN)/10.0 AS mintemp,
avg(TX)/10.0 AS maxtemp,
avg(RH)/10.0 AS precip,
/*
avg(TG) OVER (
ORDER BY strptime(YYYYMMDD, '%Y%m%d') ASC
RANGE BETWEEN INTERVAL (1) YEARS PRECEDING
AND INTERVAL (1) YEARS FOLLOWING) / 10.0 AS daytemp,
min(TN) OVER (
ORDER BY strptime(YYYYMMDD, '%Y%m%d') ASC
RANGE BETWEEN INTERVAL (1) YEARS PRECEDING
AND INTERVAL (1) YEARS FOLLOWING) / 10.0 AS mindaytemp,
max(TX) OVER (
ORDER BY strptime(YYYYMMDD, '%Y%m%d') ASC
RANGE BETWEEN INTERVAL (1) YEARS PRECEDING
AND INTERVAL (1) YEARS FOLLOWING) / 10.0 AS maxdaytemp
*/
FROM debilt
--WHERE YYYYMMDD BETWEEN 20180101 AND 20190101
GROUP BY date, month,year
ORDER BY year, month
`)
viewof mijninput = {
let handler = function(d){
this.value = 'smurf';
}
return html`<div onclick=${handler}> Hoi! </div>`
}
mijninput
viewof mijntijd = Inputs.datetime({value: new Date('2000-01-01 02:00:00')})
Plot.line(tidydata_precip.filter(d=>d.date > mijntijd), {x: 'date', y: 'value', stroke: 'cat'}).plot()
Plot.plot({
marks: [
Plot.line(data, {x: d=>timeparser(d.YYYYMMDD), y: d=>d.TG, stroke: 'steelBlue'}),
Plot.line(data, {x: d=>timeparser(d.YYYYMMDD), y: d=>d.TX, stroke: 'red'})
]
})
tidydata_precip = data.map(d=>{
let timeparse = d3.timeParse('%Y%m%d');
return [{
date: timeparse(d.YYYYMMDD),
cat: 'Temperatuur_grond',
value: d.TG / 10
},{
date: timeparse(d.YYYYMMDD),
cat: 'Temperatuur_1m',
value: d.TX / 10
}]
}).flat();
data1 = [{a:1},{a:2},{a:3}]
data2 = {
let flups = JSON.parse(JSON.stringify(data1));
return flups.map(d=>{
d.b = d.a+1;
return d;
})
}
data1
timeparser = d3.timeParse('%Y%m%d')
data = db.query(`SELECT * FROM debilt`)
db.describeColumns({table: 'debilt'})
db = DuckDBClient.of({debilt: FileAttachment("etmgeg_260.parquet")})
import {linearRegression} from "9fc6187b5f9d2293"
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.
