2b:null 2c:["$","title",null,{"children":"Untitled | astroclockface | Observable"}] 31:T1c1a,chart = { const svg = d3.create("svg") .attr("viewBox", [0, 0, svg_size, svg_size]); var chart = { node: svg.node() }; var defs = svg.append('defs') defs.append(hand_marker) svg.append("circle") .attr("r", svg_size / 2 - .5) .attr("cx", svg_size / 2) .attr("cy", svg_size / 2) .attr("stroke", "#aaa") .attr("fill", "#888"); svg.append("circle") .attr("r", radius_t) .attr("cx", svg_size / 2) .attr("cy", svg_size / 2) .attr("stroke", "#aaa") .attr("fill", "#000"); var twilights = calculateTwilightAngles(); var twilight = svg.append("g").attr("class", "twilights").attr("id", "twilights"); twilight.append("path") .attr('id', 'astronomical-twilight') .attr("transform", `translate(${svg_size / 2},${svg_size / 2})`) .attr("d", d3.arc()({ innerRadius: radius, outerRadius: radius_t, startAngle: -twilights[0], endAngle: twilights[0] })) .attr("fill", "#006") .attr("stroke", "none"); twilight.append("path") .attr('id', 'nautical-twilight') .attr("transform", `translate(${svg_size / 2},${svg_size / 2})`) .attr("d", d3.arc()({ innerRadius: radius, outerRadius: radius_t, startAngle: -twilights[1], endAngle: twilights[1] })) .attr("fill", "#009") .attr("stroke", "none"); twilight.append("path") .attr('id', 'civil-twilight') .attr("transform", `translate(${svg_size / 2},${svg_size / 2})`) .attr("d", d3.arc()({ innerRadius: radius, outerRadius: radius_t, startAngle: -twilights[2], endAngle: twilights[2] })) .attr("fill", "#00c") .attr("stroke", "none"); twilight.append("path") .attr('id', 'daylight') .attr("transform", `translate(${svg_size / 2},${svg_size / 2})`) .attr("d", d3.arc()({ innerRadius: radius, outerRadius: radius_t, startAngle: -twilights[3], endAngle: twilights[3] })) .attr("fill", "#00f") .attr("stroke", "none"); chart.twilight = twilight; svg.append("circle") .attr("r", radius) .attr("cx", svg_size / 2) .attr("cy", svg_size / 2) .attr("fill", "#00a") .attr("stroke", "none"); var clip_face = defs .append('clipPath') .attr('id', 'clip-face'); clip_face.append("circle") .attr("r", radius) .attr("cx", svg_size / 2) .attr("cy", svg_size / 2); var gClipped = svg.append("g") .attr('clip-path', 'url(#clip-face)'); chart.starmap = gClipped; var gSky = gClipped.append("g").attr("class", "sky").attr("id", "sky"); chart.skyGrid = gSky.append("path") .attr("class", "sky_grid") .attr("id", "sky_grid") .attr("fill", "none") .attr("stroke", "white") .attr("opacity", .3) .attr("stroke-width", 1); // celestial equator chart.skyEq = gSky.append("path") .attr("class", "sky_eq") .attr("id", "sky_eq") .attr("fill", "none") .attr("stroke", "white") .attr("opacity", 1) .attr("stroke-width", 1); // zenith chart.z_char = put_char(gSky, "Z").attr("fill", "#fff"); var gEarth = gClipped.append("g").attr("class", "earth").attr("id", "earth"); chart.gEarth = gEarth; chart.horizons = gEarth.append("g").attr("class", "horizons").attr("id", "horizons"); var gGlobe = gEarth.append("g"); chart.globe_grid = gGlobe.append("path") .attr("class", "globe_grid") .attr("id", "globe_grid") .attr("transform","translate(107,264) scale(0.73)") .attr("fill", "none") .attr("opacity", .1) .attr("stroke", "white") .attr("stroke-width", .3); chart.earth_grid = gEarth.append("path") .attr("class", "earth_grid") .attr("id", "earth_grid") .attr("fill", "none") .attr("opacity", .3) .attr("stroke", "white") .attr("stroke-width", .5); chart.nadir_char = put_char(gEarth, "Nadir") .attr("font-size", 14).attr("fill", "#ec9"); chart.s_char = put_char(gEarth, "S") .attr("font-size", 14).attr("fill", "#ec9"); chart.w_char = put_char(gEarth, "W") .attr("font-size", 14).attr("fill", "#ec9"); chart.n_char = put_char(gEarth, "N") .attr("font-size", 14).attr("fill", "#ec9"); chart.e_char = put_char(gEarth, "E") .attr("font-size", 14).attr("fill", "#ec9"); var gSun = gClipped.append("g").attr("class", "sun"); // sidereal time hands // define hand length (for star) in image space: chart.sidereal_1 = gSun.append("path") .attr("fill", "none") .attr("stroke", "#444") .attr("opacity", 1) .attr("stroke-width", 1); chart.sidereal_2 = gSun.append("path") .attr("fill", "none") .attr("stroke", "#444") .attr("opacity", 1) .attr("stroke-width", 1); chart.star = gSun.append(star_shape); // ecliptic chart.ecliptic = gSun.append("g") .attr("class", "ecliptic") .attr("id", "ecliptic"); chart.milkyway = gSky.append("path") .attr("class", "milkyway") .attr("id", "milkyway"); chart.cons_borders = gSky.append("path") .attr("class", "constellation_bounds") .attr("id", "constellation_bounds"); chart.cons_lines = gSky.append("path") .attr("class", "constellation_lines") .attr("id", "constellation_lines"); chart.cons_names = gSky.append("g") .attr("class", "constellation_names") .attr("id", "constellation_names"); chart.stars = gSky.append("g") .attr("class", "stars") .attr("id", "stars"); chart.tropics_text = gSky.append("g") .attr("class", "tropic_names") .attr("id", "tropic_names"); chart.tropics_circles = gSky.append("g") .attr("class", "tropic_circles") .attr("id", "tropic_circles"); // zodiac chart.zodiac = gSun.append("g") .attr("class", "zodiac") .attr("id", "zodiac"); // calendar chart.calendar = gSun.append("g") .attr("class", "calendar") .attr("id", "calendar"); // dot in middle of hands svg.append("circle") .attr("r", 4) .attr("cx", svg_size / 2) .attr("cy", svg_size / 2) .attr("fill", "black"); // border of clock face (has to be above the earth and sky fills) svg.append("circle") .attr("r", radius) .attr("cx", svg_size / 2) .attr("cy", svg_size / 2) .attr("fill", "none") .attr("stroke", "black"); // mean solar time scale chart.solar_time = new TimeScale(svg, "solar-time", radius, "#fff", "#777", d => roman_num(d), svg_size / 2); // chart.solar_time.g_labels.style('letter-spacing', '-0.0625625em'); // local time scale chart.local_time = new TimeScale(svg, "local-time", radius_t, "#fff", "#777", d => d, svg_size / 2); var gHands = svg.append("g"); chart.hands = gHands; // sun hand chart.sun_line = gHands.append("path") .attr("fill", "none") .attr("stroke", "#000") .attr("opacity", 1) .attr("stroke-width", 2) .attr("marker-end", "url(#hand-end)"); chart.sun = gHands.append("circle"); // moon hand // mean lunar time (without equation) chart.moon_line = gHands.append("path") .attr("fill", "none") .attr("stroke", "#000") .attr("opacity", .7) .attr("stroke-width", 1.5); chart.moon = [gHands.append("circle"), gHands.append("path")] return chart; }32:T1ba1,update_chart = { var svg_earth_rot = `rotate(${flip_pole(-rot_clock_dial) * 360} ${svg_size/2} ${svg_size/2})`; var map_rot = `rotate(${-(flip_pole(-rot_clock_dial) * 360 + flip_pole((observer[0]) - current_time.utc_offset * 15))} ${svg_size/2} ${svg_size/2})`; chart.gEarth.attr("transform", svg_earth_rot); chart.starmap.attr("transform", map_rot); chart.hands.attr("transform", map_rot); chart.twilight.attr("transform", map_rot); chart.skyGrid.datum(graticule_sky) .attr("d", path_earth) .attr("transform", svg_earth_rot); chart.skyEq.datum(celestial_eq).attr("d", path_celestial); update_char(chart.z_char, projection_earth([0, 90])); update_char(chart.nadir_char, projection_earth([0, -90])); update_char(chart.s_char, projection_earth([0, -3])); update_char(chart.w_char, projection_earth([90, -3])); update_char(chart.n_char, projection_earth([180, -3])); update_char(chart.e_char, projection_earth([270, -3])); var sun_angle = sun_rot * 360; var moon_angle = moon_rot * 360; var sun = projection_celestial(sun_pos); var moon = projection_celestial(moon_pos); // sidereal time hands // define hand length (for star) in image space: var ecliptic_q1 = projection_celestial([180, 0]); var ecliptic_q2 = projection_celestial([ 90, axis_tilt]); var ecliptic_q4 = projection_celestial([-90, -axis_tilt]); var sid_line = hand_with_length([0, -pole_lookat], [0, 0], projection_celestial, radius - 15) var star = sid_line[1]; // mean solar time (without equation) // define length in image space var sun_line = hand_with_length([sun_angle, -pole_lookat], [sun_angle, 0], projection_celestial, radius - 19); chart.sidereal_1.datum(mk_path([ecliptic_q1, sid_line[1]])).attr("d", path_identity); chart.sidereal_2.datum(mk_path([ecliptic_q2, ecliptic_q4])).attr("d", path_identity); chart.sun_line.datum(mk_path(sun_line)).attr("d", path_identity); chart.moon_line.datum(mk_path([[0, -pole_lookat], [moon_angle, flip_pole(axis_tilt)]])) .attr("d", path_celestial); var star_rot = 180 - 360 * flip_pole(sky_rot + rot_clock_dial - Math.floor(sky_rot)); chart.star.attr("transform", `translate(${star[0] - 10} ${star[1] - 10}) scale(0.625) rotate(${star_rot} 16 16) `); update_moon_shape(chart.moon[0], chart.moon[1], moon, 12, 2, moon_phase) chart.sun .attr("r", 14) .attr("cx", sun[0]) .attr("cy", sun[1]) .attr("stroke", "black") .attr("stroke-width", 1) .attr("fill", "yellow"); var mk_horizon = d3.geoCircle().radius(90).precision(10).center([0, -90]); var horizons_data = [ {a:0, fill:"#906850"}, {a:6, fill:"#786050"}, {a:12, fill:"#635850"}, {a:18, fill:"#4b4b50"} ] chart.horizons .selectAll("path") .data(horizons_data) .join("path") .attr("d", d => path_earth(mk_horizon.radius(90 - d.a)())) .attr("fill", d => d.fill) .attr("stroke", "black") .attr("opacity", 1) .attr("stroke-width", d => d.a == 0 ? 1 : .3); chart.earth_grid.datum(graticule).attr("d", path_earth); // it is important for performance that we avoid circles with a centre // near the pole *opposite of* the celestial pole we’re looking at. var mk_track = d3.geoCircle().radius(90).precision(10).center([0, pole_lookat]); chart.milkyway .datum(milkyway.mwbg) .attr("d", path_celestial) .attr("fill", "white") .attr("opacity", .4); chart.cons_borders .datum(constellations.bounds) .attr("d", path_celestial) .attr("fill", "none") .attr("stroke", "white") .attr("opacity", .5) .attr("stroke-width", 1) .attr("stroke-dasharray", [3, 4]); chart.cons_lines .datum(constellations.lines) .attr("d", path_celestial) .attr("fill", "none") .attr("stroke", "white") .attr("opacity", .5) .attr("stroke-width", 1); chart.stars .selectAll("circle") .data(sky_display == "Constellations" ? stars.features : []) .join("circle") .datum(d => d) .attr("cx", s => projection_celestial(s.geometry.coordinates)[0]) .attr("cy", s => projection_celestial(s.geometry.coordinates)[1]) .attr("r", s => (9 - s.properties.mag)**0.3) .attr("fill", "white") .attr("opacity", 1); chart.cons_names .selectAll("text") .data(sky_display == "Constellations" ? constellations.names.features : []) .join("text") .datum(d => d) .text(c => c.properties.desig) .attr("dy", ".4em") .attr("text-anchor", "middle") .attr("fill", "white") .attr("font-size", 14) .attr("transform", c => `rotate(${-(sky_rot + rot_clock_dial) * 360 - (1-is_north_up) * 180 - c.geometry.coordinates[0]} ${projection_celestial(c.geometry.coordinates)[0]} ${projection_celestial(c.geometry.coordinates)[1]})`) .attr("x", c => projection_celestial(c.geometry.coordinates)[0]) .attr("y", c => projection_celestial(c.geometry.coordinates)[1]) .attr("opacity", 0.3); chart.tropics_text .selectAll("text") .data(tropic_text) .join("text") .datum(d => d) .text(a => a.text) .attr("dy", ".4em") .attr("text-anchor", "middle") .attr("fill", "white") .attr("font-size", 14) .attr("x", a => a.p[0]) .attr("y", a => a.p[1]); chart.tropics_circles .selectAll("path") .data(tropics_data) .join("path") .attr("d", path_celestial) .attr("fill", "none") .attr("stroke", "white") .attr("opacity", 1) .attr("stroke-width", 1) .attr("stroke-dasharray", [3, 4]); chart.ecliptic .selectAll("path") .data(calendar.lines) .join("path") .attr("d", path_celestial) .attr("fill", "none") .attr("stroke", "#fe9") .attr("opacity", 1) .attr("stroke-width", 1.5); chart.zodiac.selectAll("text") .data(calendar.zodiac_names) .join("text") .datum(d => d) .text(a => a.text) .attr("dy", ".4em") .attr("text-anchor", "middle") .attr("fill", "#fe9") .attr("font-size", 12) .attr("transform", a => `rotate(${a.r} ${a.p[0]} ${a.p[1]})`) .attr("x", a => a.p[0]) .attr("y", a => a.p[1]); chart.calendar.selectAll("text") .data(calendar.month_names) .join("text") .datum(d => d) .text(a => a.text) .attr("dy", ".4em") .attr("text-anchor", "middle") .attr("fill", "#fe9") .attr("font-size", 12) .attr("transform", a => `rotate(${a.r} ${a.p[0]} ${a.p[1]})`) .attr("x", a => a.p[0]) .attr("y", a => a.p[1]); var rot_solar_clock = -(flip_pole(rot_clock_dial) + flip_pole((observer[0] / 360) - current_time.utc_offset / 24)); chart.solar_time.update(rot_solar_clock); var rot_clock_mirrored = -flip_pole(rot_clock_dial); chart.local_time.update(rot_clock_mirrored); }33:T9f4,calendar = { var c = d3.geoCircle().precision(10).center([-90 + 180 * is_north_up, -flip_pole(90 + axis_tilt)]); // var l = [c.radius(90.5)(), c.radius(89.5)(), c.radius(85)(), c.radius(84.5)(), c.radius(79.5)()]; var l = [c.radius(96)(), c.radius(95)(), c.radius(90.5)(), c.radius(89.5)(), c.radius(85)()]; var chars = ["Ari", "Tau", "Gem", "Cnc", "Leo", "Vir", "Lib", "Sco", "Sgr", "Cap", "Aqr", "Psc"]; var z = []; var mon = ['Jan','Feb','Mar','Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dec'] var n = []; var days = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31] var deg = 360 / 365 for (var i = 0; i < 72; ++i) { var a = 5 * i; var zodiac = a % 30; if (zodiac == 0) { l.push(mk_path([ ecliptic_rotation([a, -flip_pole(-6)]), ecliptic_rotation([a, - flip_pole(-0.5)]) ])) var p1 = projection_celestial(ecliptic_rotation([a+15, -flip_pole(0)])); var p2 = projection_celestial(ecliptic_rotation([a+15, -flip_pole(5)])); var angle = Math.atan2(p2[1] - p1[1], p2[0] - p1[0]) * 180 / Math.PI; z.push({ p: projection_celestial(ecliptic_rotation([a+15, -flip_pole(-3)])), r: (angle - 90) % 360, text: chars[i/6] + "\uFE0E" }) } else { l.push(mk_path([ ecliptic_rotation([a, -flip_pole(-6)]), ecliptic_rotation([a, - flip_pole(-5)]) ])) } } var day_in_year = 0; for (var m = 0; m < 12; ++m) { for (var d = 0; d < days[m]; ++d) { var a = (deg * (day_in_year - 80)) % 360; if (d == 0) { l.push(mk_path([ ecliptic_rotation([a, -flip_pole(-.5)]), ecliptic_rotation([a, - flip_pole(5)]) ])); } else if (d % 5 == 0) { l.push(mk_path([ ecliptic_rotation([a, -flip_pole(-.5)]), ecliptic_rotation([a, - flip_pole(.5)]) ])); } if (d == 15) { var p1 = projection_celestial(ecliptic_rotation([a, -flip_pole(0)])); var p2 = projection_celestial(ecliptic_rotation([a, -flip_pole(5)])); var angle = Math.atan2(p2[1] - p1[1], p2[0] - p1[0]) * 180 / Math.PI; n.push({ p: projection_celestial(ecliptic_rotation([a, -flip_pole(2.5)])), r: (angle - 90) % 360 , text: mon[m] }) } day_in_year++; } } return { lines: l, month_names: n, zodiac_names: z }; }34:T4f8,function TimeScale(parent, id, radius, color, shadow_color, mk_text, canvas_offset) { this.color = color; this.shadow_color = shadow_color; this.mk_text = mk_text; this.canvas_offset = canvas_offset; this.radius = radius; this.g = parent.append("g") .attr("class", id) .attr("id", id); this.g.attr("transform", `translate(${this.canvas_offset}, ${this.canvas_offset})`); this.g_labels = this.g.append("g") .attr("text-anchor", "middle") .attr("font-size", 16) .attr("fill", this.color) this.g_labels .selectAll("text") .data(d3.range(24)) .join("text") .datum(d => ({a: 2 * Math.PI / 24 * d, deg: 15*d, text: this.mk_text(d)}) ) .text(a => a.text) .attr("transform", a => `rotate(${180 + a.deg} 0 0)`) .attr("x", 0) .attr("y", -(this.radius + 8)); this.g.append("g") .attr("stroke", color) .selectAll("line") .data(d3.range(96)) .join("line") .datum(d => ({a:2 * Math.PI / 96 * d, l:(d & 3) == 0 ? 5 : 2.5})) .attr("x1", x => this.radius * Math.cos(x.a)) .attr("x2", x => (this.radius + x.l) * Math.cos(x.a)) .attr("y1", x => this.radius * Math.sin(x.a)) .attr("y2", x => (this.radius + x.l) * Math.sin(x.a)); } 35:T643,function calculateTwilightAngles() { var radians = (degrees) => degrees * (Math.PI/180); var degrees = (radians) => radians * (180/Math.PI); var longitude = observer[0]; var latitude = observer[1]; var elevation = 0.0; var ts = current_time.date.getTime()/1000; var n = Math.ceil((ts / 86400.0 + 2440587.5) - (2451545.0 + 0.0009) + 69.184 / 86400.0); var j = n + 0.0009 - longitude / 360.0; var m = (357.5291 + 0.98560028 * j) % 360; var c = 1.9148 * Math.sin(radians(m)) + 0.02 * Math.sin(2 * radians(m)) + 0.0003 * Math.sin(3 * radians(m)); var lambda_radians = radians((m + c + 180.0 + 102.9372) % 360); var sin_d = Math.sin(lambda_radians) * Math.sin(radians(23.4397)); var cos_d = Math.cos(Math.asin(sin_d)); var w0_radians = Math.acos((Math.sin(radians(-0.833 - 2.076 * Math.sqrt(elevation) / 60.0)) - Math.sin(radians(latitude)) * sin_d) / (Math.cos(radians(latitude)) * cos_d)); var w6_radians = Math.acos((Math.sin(radians(-6 - 2.076 * Math.sqrt(elevation) / 60.0)) - Math.sin(radians(latitude)) * sin_d) / (Math.cos(radians(latitude)) * cos_d)); var w12_radians = Math.acos((Math.sin(radians(-12 - 2.076 * Math.sqrt(elevation) / 60.0)) - Math.sin(radians(latitude)) * sin_d) / (Math.cos(radians(latitude)) * cos_d)); var w18_radians = Math.acos((Math.sin(radians(-18 - 2.076 * Math.sqrt(elevation) / 60.0)) - Math.sin(radians(latitude)) * sin_d) / (Math.cos(radians(latitude)) * cos_d)); return [w18_radians, w12_radians, w6_radians, w0_radians]; }36:[] 2f:{"id":"9af789503385a285","slug":null,"title":"","thumbnail":"1714bb0d970169d36eb6634ab2e8e5276897d3c868d2c39e343b3b9448010746","access_level":"public","create_time":"$D2024-03-05T15:19:13.219Z","update_time":"$D2026-01-28T11:31:21.088Z","view_time":null,"first_public_time":"$D2024-03-05T15:19:13.219Z","has_unpublished_edits":null,"fork":{"id":"cd41adb04b51851d","slug":"astronomical-clock","title":"Astronomical clock","owner":{"id":"3ebafa4f59a35ad3","login":"roelandschoukens","name":"Roeland Schoukens"}},"stars":2,"starred":false,"owner":{"type":"team","id":"9aa4d20708b4bb78","login":"astroclockface","name":"astroclockface","avatar_url":"https://avatars-next.observableusercontent.com/045d8f6674c0be38934e97186c0283085a000586d0b839e7f7178a6cdffd1e00","tier":"starter_2024"},"version":4018,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"b0a8a3e973a4f485","login":"ronnie-bathoorn","name":"Ronnie Bathoorn","avatar_url":"https://avatars-next.observableusercontent.com/ee2cd0c7cb801fca20d88fd5c40aa3697e70ce6bdf4fdff970d8f02e931e00d0","tier":null}],"members":[{"type":"individual","id":"b0a8a3e973a4f485","login":"ronnie-bathoorn","name":"Ronnie Bathoorn","avatar_url":"https://avatars-next.observableusercontent.com/ee2cd0c7cb801fca20d88fd5c40aa3697e70ce6bdf4fdff970d8f02e931e00d0","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"","cells":[{"id":2,"value":"display = {\n var div = html`

`;\n div.appendChild(chart.node)\n div.style.resize = 'horizontal';\n div.style.width = svg_max_width+\"px\";\n div.style.maxWidth = '100%';\n div.style.minWidth = '100px';\n div.style.overflow = 'hidden';\n return div;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3278,"value":"Inputs.bind(timeButtons({frameInterval: 50, step: 20000, speed: (param('now', '0') == '0') ? 0 : 1}), viewof current_time)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2732,"value":"viewof current_time = timeSliders({value: new Date(), width: 600, withUtcSlider: true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2612,"value":"viewof observer = location({label: \"Observer\", value: amsterdam, projectionFactory: d3.geoEquirectangular, width: 432, theme:\"bw-light\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":891,"value":"Inputs.bind(currentLocationButton(undefined, {now: param('here', '0') != '0', label: \" \"}), viewof observer)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":713,"value":"viewof anchor = Inputs.radio([\"Sky\", \"Observer\", \"Mean solar time\"], {label: \"Fix rotation to:\", value: \"Observer\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2081,"value":"viewof sky_display = Inputs.radio([\"Sky grid\", \"Earth grid\", \"Constellations\", \"None\"], {label: \"Sky display:\", value: \"Constellations\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2136,"value":"viewof sun_moon_mode = Inputs.radio(new Map([[\"Mean solar time\", \"clock\"], [\"Mean rotation on ecliptic\", \"ecliptic\"], [\"+ orbit eccentricity\", \"eqn\"]]), {label: \"Sun position:\", value: \"clock\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2186,"value":"{\n if (sun_moon_mode == \"clock\") { return md` `; }\n var e = sun_rot - sun_pos[0] / 360;\n e -= Math.round(e);\n var s = e * 24 * 60 * 60;\n var sgn = s < 0 ? \"−\" : \"+\";\n s = Math.abs(s);\n s = Math.round(s);\n var m = Math.floor(s / 60);\n s -= 60*m;\n return md`Displayed equation of time: ${sgn}${pad(m)}′${pad(s)}″`\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2088,"value":"credit = html`

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2572,"value":"md`*Fine print: we are ignoring the precession of the equinox, the irregularity of the moon orbit, and the rotation of Earth around the Earth/Moon barycenter. Moon position is only a rough approximation.*\n\n*Zodiac signs are about 1 off compared to the actual constellations but that is expected.*\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":417,"value":"md`--------------------------\n\n## Recipe`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":710,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1863,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1295,"value":"md`### Default location`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3696,"value":"amsterdam = [4.897070, 52.377956];","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":414,"value":"md`### Time and angles`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1216,"value":"md`#### Default time`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1293,"value":"param = {\n var params = new URLSearchParams(html``.search)\n return function(key, def)\n {\n var v = params.get(key);\n if (v == null) return def;\n return v;\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1218,"value":"md`#### length of day and year`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":461,"value":"// Sidereal year\ndays_per_year = 365.256363","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":427,"value":"milliseconds_per_year = days_per_year * milliseconds_per_day","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":465,"value":"milliseconds_per_day = 86400 * 1000","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":475,"value":"milliseconds_per_sidereal_day = milliseconds_per_year / (days_per_year + 1);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":529,"value":"milliseconds_per_lunar_month = 29.530589 * milliseconds_per_day","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1227,"value":"md`#### Orbit parameters`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"axis_tilt = 23.4","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":318,"value":"// Moment the mean solar time passes through the first point of Aries\n// (this is when the sidereal time at 0°E is the same as the mean solar time).\n// Due to equation of time this is about two days later than the equinox.\nequinox = Date.UTC(2020, 2, 22, 0)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2350,"value":"// sun_rot value at perihelion (this is a point where the effect of\n// orbit eccentricity on equation of time is zero)\nsun_rot_perihelion = .784","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2525,"value":"// Time stamp of a new moon (according to mean lunation)\n// To get close to the average you should pick a new moon in\n// the longest or shortest lunar cycle.\nnew_moon = Date.UTC(2023, 8, 15, 1, 39)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1234,"value":"md`#### Rotations\n\nRotations are expressed in units of one full rotation, and the direction is correct for looking towards the south pole.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":491,"value":"// sun rotation relative to sky. 0 at vernal equinox\nsun_rot = (current_time.date.getTime() - equinox) / milliseconds_per_year","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3821,"value":"sun_a = (sun_rot * 360) % 360","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":320,"value":"// sky rotation relative to earth\nsky_rot = -sun_rot_epoch - current_time.date.getTime() / milliseconds_per_sidereal_day - observer[0] / 360;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3829,"value":"sky_a = (180 - (sky_rot-Math.floor(sky_rot)) * 360) ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2332,"value":"// Sky rotation at Unix epoch\n// at lon=0°E at 0 local time, sky_rot == -sun_rot so the sun\n// is exactly north\nsun_rot_epoch = -equinox / milliseconds_per_year;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":534,"value":"moon_rot = sun_rot + (current_time.date.getTime() - new_moon) / milliseconds_per_lunar_month;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3827,"value":"moon_a = (moon_rot * 360) % 360","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2039,"value":"// declination of the point on the ecliptic with given longitude (λ)\ndeclination_on_ecliptic = λ => Math.asin(sin_axis_tilt * Math.sin(λ)) * 180 / Math.PI","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2051,"value":"// Calculates the ecliptic longitude (λ) of the point on the ecliptic\n// with a given right ascension (α)\n// α is derived (for the sun) from mean solar time.\nfunction rot_to_λ(rot)\n{\n var α = rot * Math.PI * 2;\n return Math.atan2(Math.sin(α), Math.cos(α) * cos_axis_tilt);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2384,"value":"// convert ecliptic coordinates to equatorial: (λ, β) to (α, δ)\necliptic_rotation = d3.geoRotation([0, 0, axis_tilt]);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":370,"value":"sun_pos = {\n var angle = sun_rot * 360 % 360;\n if (sun_moon_mode == \"clock\")\n return [angle, declination_on_ecliptic(rot_to_λ(sun_rot))];\n else if (sun_moon_mode == \"ecliptic\")\n return ecliptic_rotation([angle, 0]);\n else // \"eqn\"\n // apply approximation from Wikipedia, ahem, the Astronomical Almanac\n // this has zero crossings at aphelion (↗) and perihelion (↘)\n var g = (sun_rot - sun_rot_perihelion) * 2 * Math.PI;\n angle += 1.915 * Math.sin(g) + 0.020 * Math.sin(2*g);\n return ecliptic_rotation([angle, 0]);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":541,"value":"// The moon orbit is not that regular, so just settle for\n// mean lunar time\nmoon_pos = [moon_rot * 360 % 360, declination_on_ecliptic(rot_to_λ(moon_rot))]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":598,"value":"moon_phase = {\n var d = moon_rot - sun_rot;\n return d - Math.floor(d);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2037,"value":"sin_axis_tilt = Math.sin(Math.PI / 180 * axis_tilt)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2059,"value":"cos_axis_tilt = Math.cos(Math.PI / 180 * axis_tilt)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":719,"value":"rot_clock_dial = (anchor == \"Observer\" ? 0 : anchor == \"Mean solar time\" ? -sky_rot - sun_rot - .50: -sky_rot + flip_pole(.25))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":526,"value":"md`### Formats`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":509,"value":"date_format = Intl.DateTimeFormat(undefined, {\n timeStyle: \"short\",\n dateStyle: \"medium\",\n timeZone: \"UTC\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2927,"value":"sidereal_time_format = Intl.DateTimeFormat(undefined, {\n timeStyle: \"short\", timeZone: \"UTC\", hourCycle: 'h24'})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2365,"value":"pad = n => (\"00\" + n).slice(-2)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1052,"value":"function roman_num(d)\n{\n if (d == 0) return \"XII\";\n if (d == 12) return \"XII\"\n if (d > 12) d -= 12;\n \n var s = \"\";\n while (d >= 9)\n {\n s = s + \"X\";\n d -= 10;\n }\n if (d >= 4) // clocks usually have IIII for 4\n {\n s = s + \"V\";\n d -= 5;\n }\n while (d > 0)\n {\n s = s + \"I\";\n d -= 1;\n }\n while (d < 0)\n {\n s = s.substr(0, s.length - 1) + \"I\" + s.substr(s.length - 1, 1);\n d += 1;\n } \n return s;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":523,"value":"md`### SVG draw metrics`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"radius = .44 * svg_size","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1026,"value":"radius_t = .47 * svg_size","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"svg_size = 800","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2627,"value":"svg_max_width = +param(\"width\", 1024)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":411,"value":"md`### Projections`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1998,"value":"is_north_up = observer[1] <= 0 ? 1 : 0","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2001,"value":"function flip_pole(n)\n{\n return is_north_up ? -n : n;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":765,"value":"pole_lookat = flip_pole(90)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"projection_celestial = {\n var rot = [(sky_rot + rot_clock_dial) * 360 + (1-is_north_up) * 180,\n pole_lookat];\n return d3.geoStereographic()\n .reflectX(true)\n .scale(svg_size / 4)\n .translate([svg_size / 2, svg_size / 2])\n .rotate(rot)\n .clipAngle(180 - 1e-4)\n .clipExtent([[0, 0], [svg_size, svg_size]])\n .precision(0.2);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":111,"value":"projection_earth = d3.geoStereographic()\n .scale(svg_size / 4)\n .translate([svg_size / 2, svg_size / 2])\n .rotate([is_north_up * 180, Math.abs(observer[1])])\n .clipAngle(180 - 1e-4)\n .clipExtent([[0, 0], [svg_size, svg_size]])\n .precision(0.2)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3643,"value":"projection_earthglobe = d3.geoGnomonic()\n .scale(svg_size / 4)\n .translate([svg_size / 2, svg_size / 2])\n .rotate([!is_north_up * 180-observer[0], -90-7.5])\n .clipAngle(60)\n .clipExtent([[0, 0], [svg_size, svg_size]])\n .precision(0.2)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"path_celestial = d3.geoPath(projection_celestial);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":959,"value":"path_identity = d3.geoPath()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":112,"value":"path_earth = d3.geoPath(projection_earth);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3646,"value":"path_earthglobe = d3.geoPath(projection_earthglobe);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":242,"value":"function mk_path(coords)\n{\n return {\n type: \"LineString\",\n coordinates: coords\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":408,"value":"md`### Shapes`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"graticule = d3.geoGraticule().step([90, 90]).extent([[-180, -90], [179.99999, 0]])();","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":131,"value":"graticule_sky = {\n if (sky_display == \"None\") { return []; }\n \n return d3.geoGraticule().step([15, 15]).extent([[-180, -90], [179.99999, 90]])();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3380,"value":"constellations = {\n if (sky_display == \"Constellations\")\n {\n return {\n lines: await d3.json(\"https://ofrohn.github.io/data/constellations.lines.json\"),\n bounds: await d3.json(\"https://ofrohn.github.io/data/constellations.bounds.json\"),\n names: await d3.json(\"https://ofrohn.github.io/data/constellations.json\")\n };\n }\n \n return [];\n\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3682,"value":"milkyway = {\n if (sky_display == \"Constellations\")\n {\n var mw = await d3.json(\"https://ofrohn.github.io/data/mw.json\");\n return {\n mw: mw,\n mwbg: getMwbackground(mw)\n };\n } else {\n return [];\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3383,"value":"stars = {\n if (sky_display == \"Constellations\")\n {\n var s = await d3.json(\"https://ofrohn.github.io/data/stars.6.json\");\n return {\n type: \"FeatureCollection\",\n features: s.features.filter(d => d.properties.mag < 4.0)\n }\n }\n \n return [];\n\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":289,"value":"ecliptic = {\n var c = d3.geoCircle().precision(10).center([-90 + 180 * is_north_up, -flip_pole(90 + axis_tilt)]);\n var l = [c.radius(89.5)(), c.radius(90.5)(), c.radius(85)()];\n for (var i = 0; i < 72; ++i)\n {\n var a = 5 * i;\n var zodiac = a % 30;\n if (zodiac == 0)\n {\n l.push(mk_path([\n ecliptic_rotation([a, -flip_pole(-.5)]),\n ecliptic_rotation([a, - flip_pole(5)])\n ]))\n } else {\n l.push(mk_path([\n ecliptic_rotation([a, -flip_pole(-.5)]),\n ecliptic_rotation([a, - flip_pole(.5)])\n ])) \n }\n }\n return l;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3536,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3767,"value":"function getMwbackground(d) {\n // geoJson object to darken the mw-outside, prevent greying of whole map in some orientations \n var res = {'type': 'FeatureCollection', 'features': [ {'type': 'Feature', \n 'geometry': { 'type': 'MultiPolygon', 'coordinates' : [] }\n }]};\n\n // reverse the polygons, inside -> outside\n var l1 = d.features[0].geometry.coordinates[0];\n res.features[0].geometry.coordinates[0] = [];\n for (var i=0; i `rotate(${180 + flip_pole(x.deg)} 0 0)`)\n .style(\"text-shadow\", do_shadow);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1476,"value":"function hand_with_length(p1, p2, projection, length)\n{\n var p1 = projection(p1);\n var p2 = projection(p2);\n var dx = p2[0] - p1[0];\n var dy = p2[1] - p1[1];\n var scale = length / Math.hypot(dx, dy);\n return [p1, [p1[0] + scale * dx, p1[1] + scale * dy]];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1320,"value":"function hand_marker()\n{\n return svg`\n \n \n `;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1405,"value":"test_marker = {\n const svg = d3.create(\"svg\")\n .attr(\"viewBox\", [0, 0, svg_size, 50])\n .style(\"background\", \"#8af\");\n\n var defs = svg.append('defs')\n defs.append(hand_marker)\n \n svg.append(\"path\").attr(\"d\", \"M5 1 L80,20\").attr(\"stroke\", \"black\").attr(\"fill\", \"none\").attr(\"stroke-width\", 2)\n .attr(\"marker-end\", \"url(#hand-end)\")\n \n \n svg.append(\"path\").attr(\"d\", \"M150 -4 L280,15\").attr(\"stroke\", \"black\").attr(\"fill\", \"none\").attr(\"stroke-width\", 8)\n .attr(\"marker-end\", \"url(#hand-end)\")\n \n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1680,"value":"function update_moon_shape(circle, path, pos, size, border, phase)\n{\n circle\n .attr(\"r\", size - .5*border)\n .attr(\"cx\", pos[0])\n .attr(\"cy\", pos[1])\n .attr(\"stroke\", \"black\")\n .attr(\"stroke-width\", 1)\n .attr(\"fill\", \"#222\");\n var size_1 = size - border;\n var sin_th = Math.cos(Math.PI * 2 * phase);\n var x1 = size_1 * (phase <= .5 ? -1 : sin_th);\n var x2 = size_1 * (phase >= .5 ? 1 : -sin_th);\n path\n .attr(\"d\",\n `M${pos[0]} ${pos[1] - size_1}` +\n ` a ${Math.abs(x1)} ${size_1} 0 0 ${x1 <= 0 ? 0 : 1} 0 ${size_1*2}` +\n ` a ${Math.abs(x2)} ${size_1} 0 0 ${x2 > 0 ? 0 : 1} 0 ${-size_1*2}`)\n .attr(\"stroke\", \"none\")\n .attr(\"fill\", \"#eeeacc\");\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1682,"value":"{\n const svg = d3.create(\"svg\")\n .attr(\"viewBox\", [0, 0, 720, 32]);\n var g = svg.append(\"g\");\n for (var i = 0; i <= 20; ++i)\n {\n update_moon_shape(g.append(\"circle\"), g.append(\"path\"), [48 + 32*i, 16], 14, 1, .05 * i)\n }\n g = svg.append(\"g\");\n g.append(star_shape);\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3107,"value":"star_shape = () => svg`\n\n \n \n \n `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":404,"value":"md`## Imports`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2676,"value":"import { range, dayOfYear, timeSliders, location, timeButtons, currentLocationButton} from \"@roelandschoukens/inputs\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"d3 = require(\"d3@6\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3637,"value":"topjson = require(\"topojson@3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W36","stdlib":"1","titling":"auto"}} 30:"$2f:body"