Plot.plot({
width: Math.min(800, width),
height: Math.min(800, width),
margin: framing.margin,
style: {
background: '#000',
},
projection: {
rotate: [rotation, -elevation, 20*0],
...framing.projection,
},
r: {
range: [0.25, 2 * width/1e3],
},
marks: [
Plot.graticule({strokeOpacity: 0.3, stroke: '#fff', strokeWidth: width/1000}),
Plot.sphere({ stroke: '#fff' }),
Plot.geo(sky.constellations, {
geometry: d3.geoCircle()
.center(d => [d.circle.x, d.circle.y])
.radius(d => d.circle.r),
fill: 'transparent',
title: 'word',
}),
Plot.geo(sky.constellations, {
geometry: d => d.geoStrokes,
stroke: '#fff',
strokeWidth: 0.5 * width/1e3,
}),
Plot.geo(sky.stars.features, {
r: d => d.properties.r,
fill: '#fff',
}),
Plot.text(sky.constellations, {
text: d => d.word,
x: d => d.circle.x,
y: d => d3.min(d3.merge(d.geoStrokes.geometry.coordinates).map(p => p[1])) - 1,
fill: '#fff',
fontSize: 10 * width / 1000,
fontFamily: 'serif',
fontStyle: 'italic',
})
]
})