shkim4
ed7e8790ec
- CENTER plain page layout and shorter reference demo notes (spec values moved to the CENTER README); chart specimen descriptions trimmed - Org chart page names and previews; SW width rows follow the 30px frame margin (1980 / 1065 / 727px) and the SW tests match the current layout - Story inventory regenerated and WORKING_CONTEXT updated
40 lines
1.8 KiB
TypeScript
40 lines
1.8 KiB
TypeScript
import type { Meta, StoryObj } from "@storybook/react-vite"
|
|
import { HMRadarChart } from "@hm-design/chart"
|
|
import { sampleRadar } from "@hm-design/chart/examples"
|
|
import { StoryPage, StoryPageHeader, StorySectionGrid } from "@/components/story-page"
|
|
import { ChartSampleNotice, ChartSpecimen, chartGrid, chartPageClass } from "./chart-story"
|
|
|
|
// Sample data only. All radars share one data set (six axes, two series) and the 0-100 axis range. Same data and props as the
|
|
// @hm-design/chart/examples cards; open layout (no card): see chart-story.tsx.
|
|
const meta = {
|
|
title: "Chart/Radar Chart",
|
|
parameters: { layout: "fullscreen", controls: { disable: true } },
|
|
} satisfies Meta
|
|
export default meta
|
|
type Story = StoryObj<typeof meta>
|
|
|
|
export const Radar: Story = {
|
|
name: "Radar Chart",
|
|
render: () => (
|
|
<StoryPage className={chartPageClass}>
|
|
<StoryPageHeader title="Radar Chart" />
|
|
<ChartSampleNotice />
|
|
{/* Two per row from 1024px, all four in one row from 1600px, one below. */}
|
|
<StorySectionGrid className={chartGrid.quad}>
|
|
<ChartSpecimen title="Basic">
|
|
<HMRadarChart {...sampleRadar} label="단계별 처리 수준 방사형 차트(예시 데이터)" />
|
|
</ChartSpecimen>
|
|
<ChartSpecimen title="Dot">
|
|
<HMRadarChart {...sampleRadar} dots label="단계별 처리 수준 방사형 차트, Dot(예시 데이터)" />
|
|
</ChartSpecimen>
|
|
<ChartSpecimen title="Lines Only">
|
|
<HMRadarChart {...sampleRadar} filled={false} label="단계별 처리 수준 방사형 차트, 선만(예시 데이터)" />
|
|
</ChartSpecimen>
|
|
<ChartSpecimen title="Custom Label">
|
|
<HMRadarChart {...sampleRadar} customLabels label="단계별 처리 수준 방사형 차트, 축 Label(예시 데이터)" />
|
|
</ChartSpecimen>
|
|
</StorySectionGrid>
|
|
</StoryPage>
|
|
),
|
|
}
|