Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

arrow #657

Merged
merged 8 commits into from Jan 16, 2022
Merged

arrow #657

merged 8 commits into from Jan 16, 2022

Conversation

mbostock
Copy link
Member

@mbostock mbostock commented Jan 8, 2022

Fixes #39. Supersedes #38.

Screen Shot 2022-01-08 at 9 07 22 AM

Plot.plot({
  grid: true,
  inset: 10,
  x: {
    type: "log",
    label: "Population →"
  },
  y: {
    label: "↑ Inequality"
  },
  color: {
    type: "diverging",
    reverse: true,
    symmetric: false
  },
  marks: [
    Plot.arrow(data, {
      x1: "POP_1980",
      y1: "R90_10_1980",
      x2: "POP_2015",
      y2: "R90_10_2015",
      bend: true,
      stroke: d => d.R90_10_2015 - d.R90_10_1980
    }),
    Plot.text(data, {
      x: "POP_2015",
      y: "R90_10_2015",
      text: d => d.highlight && d.nyt_display,
      dy: -6
    })
  ]
})

TODO

  • Allow the arrowhead length to be configurable (as a multiple of strokeWidth)
  • Allow the arrowhead angle to be configurable
  • Allow the bend angle to be configurable
  • Provide a separate Plot.swoop for a bendy arrow Provide a default bend angle with bend: true
  • Documentation

Potential future work:

  • Different styles of arrowheads, maybe filled?
  • insetStart and insetEnd options to leave room for terminal dots?

On arrowhead styles, we could do this with markers instead of computing the paths as in #38. But doing it as a stroked path felt like a simpler starting point… we could always revisit in the future.

Copy link
Contributor

@Fil Fil left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

With a reminder to document the new arrow insets

mbostock and others added 8 commits January 16, 2022 10:02
* arrow insets

* fix arrowhead angle adjustment on inset

* document arrow insets

Co-authored-by: Philippe Rivière <fil@rezo.net>
@mbostock mbostock merged commit 1869ffb into main Jan 16, 2022
@mbostock mbostock deleted the mbostock/arrow branch January 16, 2022 18:08
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Arrow mark (like link, but with an arrowhead) and swoop mark (like link, but with a curved line).
2 participants