Hacktoberfest 2026:维护者为十月标记出来的 issue,仍然开放、适合新手。 浏览 Hacktoberfest issue

Absolute spacing between facets

未关闭
#2,402 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

还没有人认领这个 Issue。

评估

难度
5/5
预计耗时
一周以上
新手友好度
45/100
Issue 类型
功能
描述清晰度
基本清楚
活跃度
冷清
技术栈
javascript

调研方向

先查看 issue 中链接的 facet scales 和 discrete scales 文档,然后比较在不同高度下使用 fy.padding 的 vertical-bars 示例。定义当 facet 尺寸发生变化时,固定大小的间隔应如何表现,并验证重复使用 x-axis 的用例能够保留所请求的空间。

由索引模型根据 Issue 内容生成。

描述

enhancement
Status Quo

Currently the spacing between facets needs to be set via the implied band scale’s padding option. [1] However, that option only allows adjusting the spacing relative to the band width (or height). [2]

Motivation

For my use case, I’d like to reserve some space between the facets to repeat the x axis between them. Since I know the amount of space the tick labels will need, I’d like to instruct Plot to leave a gap of a certain fixed size.

Problem

With the current API I need to guess the amount of space Plot will use for a single facet and find a fraction that will leave an appropriate amount of space. If Plot decides that a facet should be larger (in the examples below I forced bigger facets), then my space is at risk of being too small or too large.

Examples

The examples are based on [3].

Appropriate spacing
Plot.plot({
  fy: {
    padding: .15
  },
  marks: [    
    Plot.barY(brands, {
      x: "name",
      y: "value",
      fy: (d, i) => i % 3,
    }),
    Plot.axisX({
      facetAnchor: null,
    })
  ],
})
Image
Excessive spacing
Plot.plot({
  fy: {
    padding: .15
  },
  marks: [    
    Plot.barY(brands, {
      x: "name",
      y: "value",
      fy: (d, i) => i % 3,
    }),
    Plot.axisX({
      facetAnchor: null,
    })
  ],
  height: 1000,
})
Image

[1] https://observablehq.com/plot/features/facets#facet-scales
[2] https://observablehq.com/plot/features/scales#discrete-scales
[3] https://observablehq.com/@observablehq/plot-vertical-bars-rotated-labels

主要语言
HTML
星标
5.4k
派生
246
PR 合并指标
30 天内没有已合并 PR

环境准备

  • 没有 Dockerfile 或 Docker Compose 文件
  • 没有 Pull Request 模板
  • 阅读贡献指南

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

observablehq/plot 的其他 Issue

查看 observablehq/plot 的全部 Issue

相似的 Issue

更多 Data Visualization Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。