[86by6f2gg][d3-chart] added cigarette pack chart #1477
Conversation
msereniti
changed the title
msereniti
force-pushed
the
distrb-bar-chart
branch
from
83f9f4d
to
23d687c
Compare
semcore/d3-chart/src/component/Chart/DistributionBarChart.type.ts
Outdated
Show resolved
Hide resolved
website/docs/data-display/bar-distribution/examples/clickable.tsx
Outdated
Show resolved
Hide resolved
msereniti
force-pushed
the
distrb-bar-chart
branch
from
01280e2
to
c6fa094
Compare
msereniti
force-pushed
the
distrb-bar-chart
branch
from
deb944e
to
49d4774
Compare
msereniti
force-pushed
the
distrb-bar-chart
branch
from
49d4774
to
b8b99d4
Compare
msereniti
changed the title
Signed-off-by: Julia Mnizhek <[email protected]>
|
@sheila-semrush Sheila, can you please check only documentation for CigarettePack chart when you have time? |
This comment was marked as duplicate.
This comment was marked as duplicate.
Sorry, something went wrong.
| @@ -54,10 +54,16 @@ const group = { | |||
| type: 'charts', | |||
| }, | |||
| cigaretteChart: { | |||
| title: 'Cigarette chart', | |||
| title: 'Cigarette bar chart', | |||
There was a problem hiding this comment.
hmm the cigarette disappeared (seems to be connected to its renaming) and the cigarette pack is not on the showcase page for me. Although I did run install & build. Should I run something else? Or is something broken?
There was a problem hiding this comment.
It's a bug, because the same was with the cigarette chart. It's planned to be fixed of course.
| plotHeight={450} | ||
| onClickBar={(barIndex) => alert(`Bar ${barIndex} clicked`)} | ||
| /> | ||
| <Plot data={data} scale={[xScale, yScale]} width={width} height={height}> |
There was a problem hiding this comment.
did we intentionally put 2 charts here? if yes, maybe worth splitting this example into 2 code snippets? (we did this in Tag, there's 1 example of tag grouping, but it has 2 code snippets with subheaders for clarity)
|
|
||
| **Cigarette pack bar chart** visualizes the distribution of values by category for a part-to-whole comparison. | ||
|
|
||
| ## Usage |
There was a problem hiding this comment.
I think it might be useful to put somewhere here in the beginning a little paragraph with an illustration of the horizontal bar chart (the variation that's similar to the cigarette pack), with something like "if you're thinking about this, then go there" (and a link to the horizontal bar chart page)
because I feel people might go to this page, remembering just visually what they need, but not remembering the exact name, go through the illustrations (because who reads), see that there's no variant of the chart with labels to the left of the bars, and think that there's just no documentation for that, or we removed that feature
There was a problem hiding this comment.
and maybe even acknowledge in the text that yes, these 2 things look very similar, but they're on different pages. This might make it much clearer for documentation users
There was a problem hiding this comment.
maybe an illustration with both charts clearly labelled would be useful
| - Each category's value needs labeling. | ||
| - Showing category distribution in order. | ||
|
|
||
| **Avoid horizontal bars when:** | ||
| **Use [Cigarette pack bar chart](/data-display/cigarette-pack/cigarette-pack) instead of Horizontal bar chart when:** |
There was a problem hiding this comment.
same comment as for the cigarette pack page, I'd recommend adding a little explanation that these 2 charts are really only different in labels positioning, and if you were thinking of this (illustration), then it's the cigarette pack
maybe an illustration with both charts clearly labelled would be useful
There was a problem hiding this comment.
They are actually differs a little bit in when they should be used, but overall I agree. I was doubting about adding something more straightforward in the text. Will add. It could be helpful indeed.
Signed-off-by: Julia Mnizhek <[email protected]>
Motivation and Context
This PR adds new chart type.
How has this been tested?
Tests are to be added
Screenshots (if appropriate):
Types of changes
Checklist:
CHANGELOG.mdfile with planned publish date.