Skip to content

Commit

Permalink
update charts version
Browse files Browse the repository at this point in the history
  • Loading branch information
natashadecoste committed May 19, 2021
1 parent fd9656c commit 0fd4684
Show file tree
Hide file tree
Showing 6 changed files with 78 additions and 14 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@
"gatsby-remark-images": "^3.3.33"
},
"dependencies": {
"@carbon/charts-react": "0.41.62",
"@carbon/charts-react": "0.41.65",
"@carbon/elements": "^10.34.0",
"@carbon/icons": "^10.32.0",
"@carbon/icons-react": "^10.32.0",
Expand Down
7 changes: 3 additions & 4 deletions src/data/data-visualization/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@ export const complexChartDemoGroups = storybookDemoGroups.filter(
(demoGroup) => demoGroup.type === 'complex-chart'
);

export const getDemoGroupByTitle = (title) =>
storybookDemoGroups.find(
(demoGroup) => demoGroup.title.toLowerCase() === title.toLowerCase()
);
export const getDemoGroupByTitle = (title) => storybookDemoGroups.find(
(demoGroup) => demoGroup.title.toLowerCase().replace(/\s/g, '') === title.toLowerCase()
);
35 changes: 35 additions & 0 deletions src/pages/data-visualization/chart-types/images/circle-pack.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 10 additions & 0 deletions src/pages/data-visualization/chart-types/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -238,6 +238,16 @@ appropriate chart type.
</OverviewCard>
</Column>

<Column colMax={3} colXl={3} colLg={4} colMd={4} colSm={2} noGutterSm>
<OverviewCard
title="Circle pack"
href="/data-visualization/complex-charts#circle-packs"
>
![GATSBY_EMPTY_ALT](images/circle-pack.svg)

</OverviewCard>
</Column>

</Row>

## Correlations
Expand Down
20 changes: 20 additions & 0 deletions src/pages/data-visualization/complex-charts/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ go to the
<AnchorLink>Network diagrams</AnchorLink>
<AnchorLink>Parallel coordinates</AnchorLink>
<AnchorLink>Tree maps</AnchorLink>
<AnchorLink>Circle packs</AnchorLink>
<AnchorLink>Geospatial charts</AnchorLink>

</AnchorLinks>
Expand Down Expand Up @@ -333,6 +334,25 @@ country, tourism for that country may fall below its annual average.
</Column>
</Row>

## Circle packs

A circle pack is a hierarchical visualization of data. It’s equivalent to a
Treemap or a Dendrogram—where each node of the tree is represented as a circle
and sub-nodes are represented as circles within a parent. The size of each
circle can also be used to represent an additional arbitrary value, such as
population or file size. Color may also be used to assign categories or to
represent an additional variable. Although they’re not as space efficient,
Circle Packs reveal hierarchical structure better than Treemaps.

For Circle Packs with more than two levels of hierarchy, zoom functionality
allows users to explore the data without compromising the contrast accessibility
of the chart. We advise against disabling the zoom functionality except in cases
such as preview charts, cards that expand to full view with the chart, etc.

<div>
<ChartDemoGroup demoGroup={getDemoGroupByTitle('circlepack')} light={true} />
</div>

## Geospatial charts

### Geographic overlays
Expand Down
18 changes: 9 additions & 9 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1144,18 +1144,18 @@
lodash "^4.17.19"
to-fast-properties "^2.0.0"

"@carbon/[email protected].62":
version "0.41.62"
resolved "https://registry.yarnpkg.com/@carbon/charts-react/-/charts-react-0.41.62.tgz#c820b1d72b1894370bd7b8f82006775dbfd70ddf"
integrity sha512-425nf0TlpR1ra85f7cUz0wt29GyxG/wB0J98/Zqig5e1pOcQOoARV/9e7X+w1yZlpXB3BGQ3+W7kkRTy+PKkXQ==
"@carbon/[email protected].65":
version "0.41.65"
resolved "https://registry.yarnpkg.com/@carbon/charts-react/-/charts-react-0.41.65.tgz#fe73ff3c102422c82fdf4e11c1f7c52880b0d00c"
integrity sha512-9Ex7y4fEJNcs57+giQV8Em+7DIcefkdPgc0FXVtRSL4o1VurLlH2vVCB7eW8G2/iKd8irat3ByX66jUfX/FfnA==
dependencies:
"@carbon/charts" "^0.41.62"
"@carbon/charts" "^0.41.65"
"@carbon/telemetry" "0.0.0-alpha.6"

"@carbon/charts@^0.41.62":
version "0.41.62"
resolved "https://registry.yarnpkg.com/@carbon/charts/-/charts-0.41.62.tgz#9d0f15f83f1be0383b2e108c9060fb79ee63a426"
integrity sha512-vVXbIvRg+L+tpSlyMra+wpqcmH5jAIObxLJxmhCBDYF7QHcBYRkx8n2BjUxsWwIRnGHpTZpNyYUaxDzqN9OqoA==
"@carbon/charts@^0.41.65":
version "0.41.65"
resolved "https://registry.yarnpkg.com/@carbon/charts/-/charts-0.41.65.tgz#e3bbea58db800c5d7b380a9f5ac43e2fa16aa3fd"
integrity sha512-NX1NCNAMo2ZJf5OMIUxmX9Q4uvlgThA+uJw7IILY4HmQJA3eQYPdKzczQfcwGBHbiaF76T8zOc5SEeaa5awfMA==
dependencies:
"@carbon/colors" "10.15.0"
"@carbon/telemetry" "0.0.0-alpha.6"
Expand Down

0 comments on commit 0fd4684

Please sign in to comment.