diff --git a/packages/dev/src/examples/auxiliary/crosshair/xy-components/index.tsx b/packages/dev/src/examples/xy-components/crosshair/stacked-vs-non-stacked/index.tsx similarity index 91% rename from packages/dev/src/examples/auxiliary/crosshair/xy-components/index.tsx rename to packages/dev/src/examples/xy-components/crosshair/stacked-vs-non-stacked/index.tsx index 2bd9db6e..03654c81 100644 --- a/packages/dev/src/examples/auxiliary/crosshair/xy-components/index.tsx +++ b/packages/dev/src/examples/xy-components/crosshair/stacked-vs-non-stacked/index.tsx @@ -4,8 +4,8 @@ import { generateXYDataRecords, XYDataRecord } from '@src/utils/data' import s from './styles.module.css' -export const title = 'XY Components' -export const subTitle = 'Stacked vs Non-Stacked data' +export const title = 'Stacked vs. Non-Stacked' +export const subTitle = 'XY component comparison' export const component = (): JSX.Element => { const data = generateXYDataRecords(10) diff --git a/packages/dev/src/examples/auxiliary/crosshair/xy-components/styles.module.css b/packages/dev/src/examples/xy-components/crosshair/stacked-vs-non-stacked/styles.module.css similarity index 100% rename from packages/dev/src/examples/auxiliary/crosshair/xy-components/styles.module.css rename to packages/dev/src/examples/xy-components/crosshair/stacked-vs-non-stacked/styles.module.css diff --git a/packages/dev/src/examples/xy-components/xy-container/scale-by-domain/index.tsx b/packages/dev/src/examples/xy-components/xy-container/scale-by-domain/index.tsx new file mode 100644 index 00000000..29d4360e --- /dev/null +++ b/packages/dev/src/examples/xy-components/xy-container/scale-by-domain/index.tsx @@ -0,0 +1,33 @@ +import React from 'react' +import { VisXYContainer, VisArea, VisLine, VisAxis, VisCrosshair, VisStackedBar, VisScatter } from '@unovis/react' + +export const title = 'Scale by Domain' +export const subTitle = 'XY component comparison' + +export const component = (): JSX.Element => { + const data = Array.from({ length: 10 }, (_, i) => ({ + x: i + 1, + y: Math.pow(2, i + 1), + })) + const configs = [ + { }, + { scaleByDomain: true }, + { scaleByDomain: true, xDomain: [1, 5] }, + ] + const components = [VisArea, VisLine, VisStackedBar, VisScatter] + return (<> + {components.map(// eslint-disable-next-line @typescript-eslint/naming-convention + Component => ( +