30:T804,{ const { padding, domain, range } = config; const fontSize = width > 500 ? "14px" : "10px"; return svg``; }31:T444,md`The methods for d3.scalePoint are: * [*point*.domain](https://github.com/d3/d3-scale/blob/master/README.md#point_domain) and [*point*.range](https://github.com/d3/d3-scale/blob/master/README.md#point_range), which allow to set (and read) the domain and range. The domain must be an array of values that can be stringified (see [this note about domains](https://observablehq.com/d/e2550460e583c929#objectDomain)). * [*point*.padding](https://github.com/d3/d3-scale/blob/master/README.md#point_padding) defines the fraction of (outer) padding. * [*point*.round](https://github.com/d3/d3-scale/blob/master/README.md#point_round) (or, alternatively, [*point*.rangeRound](https://github.com/d3/d3-scale/blob/master/README.md#point_rangeRound)) sets the scale to return round (integers) values. * [*point*.align](https://github.com/d3/d3-scale/blob/master/README.md#point_align) defines the way any left-over space (padding + rest from rounding) are to be distributed between left and right. * [*point*.step](https://github.com/d3/d3-scale/blob/master/README.md#point_step) reads the step.`32:[] 2e:{"title":"d3.scalePoint","cells":[{"id":0,"value":"return1 = md`# d3.scalePoint\n\nPoint scales allow to distribute an array of points equally into a given range interval. The following chart of the [phases of the Moon](/@mbostock/phases-of-the-moon) uses two such scales: the first positions the day vertically, by month (on a 12-point scale); the second positions it horizontally by day.[*](#appendix)`","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"chart","pinned":false,"hidden":false,"mode":"ojs"},{"id":46,"value":"md`For the most part, point scales behave like [band scales](https://observablehq.com/@d3/d3-scaleband) with the bandwidth fixed to zero (or, equivalently, paddingInner set to 1). Here’s a schema showing how each element of configuration impacts the scale:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":115,"value":"config = ({\n domain: [\"A\", \"B\", \"C\"], // 👀 change me!\n padding: 0.6, // 👀\n round: true, // 👀\n range: [40, Math.min(700, width - 40)], // 👀\n align: 0.5\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":114,"value":"scale = d3\n .scalePoint()\n .domain(config.domain)\n .range(config.range)\n .padding(config.padding)\n .align(config.align)\n .round(config.round)","pinned":true,"hidden":false,"mode":"ojs"},{"id":101,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":71,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":168,"value":"scale.step()","pinned":true,"hidden":false,"mode":"ojs"},{"id":20,"value":"appendix = md`---\n\n## Appendix\n\nIn the [Phases of the Moon](/@mbostock/phases-of-the-moon) notebook, the horizontal scale is defined as scalePoint().domain(d3.range(1, 40)). This range contains 39 points. Technically one could have used a scale with 37 points, as in the worst case the month’s last day could be on the day 31 + 6 (the days are shifted to be aligned by weeks!). But it seems it was more aesthetically pleasing to shift by 7 days a month that starts on a Sunday… which makes it 38. (So, the first and last slots are never used.) The tiny details!`","pinned":false,"hidden":false,"mode":"ojs"},{"id":54,"value":"d3 = require(\"d3-scale@3\", \"d3-array@2\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":4,"value":"import {chart} from \"@mbostock/phases-of-the-moon\"","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}