Skip to content

Allow stroke-dasharray to be a channel? #380

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

Open
ericemc3 opened this issue May 12, 2021 · 4 comments
Open

Allow stroke-dasharray to be a channel? #380

ericemc3 opened this issue May 12, 2021 · 4 comments
Labels
enhancement New feature or request

Comments

@ericemc3
Copy link

Similar to the vl.strokedash() channel in vega-lite, this channel could be used to display, for example, estimated values as dotted lines, i.e. depending on an indicator column in the dataset:

image image

Note: a stroke-width channel would also prove useful...

PS: Plot is a great library, very intellectually stimulating, and the 21 beautifully written articles in the https://observablehq.com/collection/@observablehq/plot collection should be read by all data scientists!

@mbostock
Copy link
Member

There is already a strokeDasharray option. See this example:

https://github.com/observablehq/plot/blob/main/test/plots/covid-ihme-projected-deaths.js

It could be made a channel I suppose, but in practice I think it is usually better to have two marks.

@mbostock mbostock added the enhancement New feature or request label May 12, 2021
@mbostock mbostock changed the title New stroke-dasharray channel? Allow stroke-dasharray to be a channel? May 12, 2021
@Fil
Copy link
Contributor

Fil commented Mar 13, 2022

Here's a common use-case where the user would want the constant to be a channel (cc @espinielli):

textAnchor: d => d.properties.city === "Moscow" ? "end" : "start",

@yurivish
Copy link
Contributor

yurivish commented Mar 14, 2022

I had the same case with textAnchor here and used two marks after trying one and learning that it wasn’t a channel.

@Fil Fil mentioned this issue Jun 2, 2022
14 tasks
@harrislapiroff
Copy link

I ran into this issue earlier this week in this notebook with two lines that were the same type of data, but one is a "current" system and one is a "proposed" system. I did accomplish this using two marks for each set of data,

    Plot.line(scenarios, {
      filter: d => d.system === 'proposed',
      stroke: PROFIT_COLOR,
      y: 'bidaProfit',
      x: 'attendees',
      fx: 'musicians',
      strokeWidth: 3,
    }),
    Plot.line(scenarios, {
      filter: d => d.system === 'current',
      stroke: PROFIT_COLOR,
      y: 'bidaProfit',
      x: 'attendees',
      fx: 'musicians',
      strokeWidth: 3,
      strokeDasharray: '2 10',
    }),

but I think it would have been more elegant if I had been able to use one:

    Plot.line(scenarios, {
      stroke: PROFIT_COLOR,
      y: 'bidaProfit',
      x: 'attendees',
      fx: 'musicians',
      strokeWidth: 3,
      strokeDasharray: d => d.system === 'current' ? '2 10' : null
    })

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

5 participants