From b82c01049fe7b633f2aaaf427fc3df42c9f1e110 Mon Sep 17 00:00:00 2001 From: yvonneyx Date: Tue, 12 Nov 2024 14:59:45 +0800 Subject: [PATCH] =?UTF-8?q?docs:=20=E5=9B=BE=E8=A1=A8=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E5=8A=9F=E8=83=BD=E7=B1=BB=E5=88=AB=E6=A0=87=E7=AD=BE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- site/docs/options/demos/components-list.tsx | 164 +++++++++++++++--- site/docs/options/graphs/dendrogram.en.md | 1 + site/docs/options/graphs/dendrogram.zh.md | 1 + .../options/graphs/flow-direction-graph.en.md | 1 + .../options/graphs/flow-direction-graph.zh.md | 1 + site/docs/options/graphs/flow-graph.en.md | 1 + site/docs/options/graphs/flow-graph.zh.md | 1 + site/docs/options/graphs/indented-tree.en.md | 1 + site/docs/options/graphs/indented-tree.zh.md | 1 + site/docs/options/graphs/mind-map.en.md | 1 + site/docs/options/graphs/mind-map.zh.md | 1 + site/docs/options/graphs/network-graph.en.md | 1 + site/docs/options/graphs/network-graph.zh.md | 1 + .../options/graphs/organization-chart.en.md | 1 + .../options/graphs/organization-chart.zh.md | 1 + site/docs/options/overview.zh.md | 7 +- site/docs/options/plots/special/area.en.md | 9 + site/docs/options/plots/special/area.zh.md | 9 + site/docs/options/plots/special/bar.en.md | 1 + site/docs/options/plots/special/bar.zh.md | 1 + .../plots/special/bidirectional-bar.en.md | 1 + .../plots/special/bidirectional-bar.zh.md | 1 + site/docs/options/plots/special/box.en.md | 1 + site/docs/options/plots/special/box.zh.md | 1 + site/docs/options/plots/special/bullet.en.md | 1 + site/docs/options/plots/special/bullet.zh.md | 1 + site/docs/options/plots/special/column.en.md | 1 + site/docs/options/plots/special/column.zh.md | 1 + .../options/plots/special/dual-axes.en.md | 1 + .../options/plots/special/dual-axes.zh.md | 1 + site/docs/options/plots/special/funnel.en.md | 1 + site/docs/options/plots/special/funnel.zh.md | 1 + site/docs/options/plots/special/gauge.en.md | 1 + site/docs/options/plots/special/gauge.zh.md | 1 + site/docs/options/plots/special/heatmap.en.md | 1 + site/docs/options/plots/special/heatmap.zh.md | 1 + .../options/plots/special/histogram.en.md | 1 + .../options/plots/special/histogram.zh.md | 1 + site/docs/options/plots/special/line.en.md | 9 + site/docs/options/plots/special/line.zh.md | 9 + site/docs/options/plots/special/pie.en.md | 1 + site/docs/options/plots/special/pie.zh.md | 1 + site/docs/options/plots/special/radar.en.md | 1 + site/docs/options/plots/special/radar.zh.md | 1 + .../options/plots/special/radial-bar.en.md | 1 + .../options/plots/special/radial-bar.zh.md | 1 + site/docs/options/plots/special/rose.en.md | 1 + site/docs/options/plots/special/rose.zh.md | 1 + site/docs/options/plots/special/sankey.en.md | 1 + site/docs/options/plots/special/sankey.zh.md | 1 + site/docs/options/plots/special/scatter.en.md | 1 + site/docs/options/plots/special/scatter.zh.md | 1 + site/docs/options/plots/special/stock.en.md | 1 + site/docs/options/plots/special/stock.zh.md | 1 + .../docs/options/plots/special/sunburst.en.md | 1 + .../docs/options/plots/special/sunburst.zh.md | 1 + site/docs/options/plots/special/treemap.en.md | 1 + site/docs/options/plots/special/treemap.zh.md | 1 + site/docs/options/plots/special/venn.en.md | 1 + site/docs/options/plots/special/venn.zh.md | 1 + .../options/plots/special/word-cloud.en.md | 1 + .../options/plots/special/word-cloud.zh.md | 1 + site/package.json | 5 +- 63 files changed, 245 insertions(+), 23 deletions(-) create mode 100644 site/docs/options/plots/special/area.en.md create mode 100644 site/docs/options/plots/special/area.zh.md create mode 100644 site/docs/options/plots/special/line.en.md create mode 100644 site/docs/options/plots/special/line.zh.md diff --git a/site/docs/options/demos/components-list.tsx b/site/docs/options/demos/components-list.tsx index 15e1a0a15..4ebe89bf2 100644 --- a/site/docs/options/demos/components-list.tsx +++ b/site/docs/options/demos/components-list.tsx @@ -1,9 +1,11 @@ /** * inline: true */ -import { Card, Col, Flex, Row, Tag } from 'antd'; +import { Button, Card, Col, Divider, Flex, Row, Tag } from 'antd'; import React, { Suspense, useMemo } from 'react'; import { useLocale, useFullSidebarData, useNavigate } from 'dumi'; +import { styled } from 'styled-components'; +import { isEmpty } from 'lodash'; enum ChartType { PLOT = 'Plot', @@ -23,34 +25,154 @@ const locales = { const URLS = ['/options/plots/special', '/options/graphs']; +const StyledWrapper = styled.div` + .filter-panel { + margin: 24px 0 32px; + + .filter-tag { + border-radius: 4px; + } + } + + .usage-items { + margin-top: 2px; + + .usage-item { + border-radius: 12px; + padding: 0px 12px; + font-size: 10px; + border: 1px solid #f0f0f0; + } + } +.` + +const usagesData = [{ + id: 'all', + nameZh: '全部', + nameEn: 'All', +}, +{ + id: 'comparison', + nameZh: '比较类', + nameEn: 'Comparison', +}, { + id: 'distribution', + nameZh: '分布类', + nameEn: 'Distribution', +}, { + id: 'flow', + nameZh: '流程类', + nameEn: 'Flow', +}, { + id: 'proportion', + nameZh: '占比类', + nameEn: 'Proportion', +}, { + id: 'interval', + nameZh: '区间类', + nameEn: 'Interval', +}, { + id: 'relation', + nameZh: '关系类', + nameEn: 'Relation', +}, { + id: 'trend', + nameZh: '趋势类', + nameEn: 'Trend', +}, { + id: 'time', + nameZh: '时间类', + nameEn: 'Time', +}, { + id: 'map', + nameZh: '地图类', + nameEn: 'Map', +}, { + id: 'other', + nameZh: '其他', + nameEn: 'Other', +}]; + export default () => { const lang = useLocale().id; const locale = locales[lang]; const data = useFullSidebarData(); const navigate = useNavigate(); + const [selectedUsages, setSelectedUsages] = React.useState(['all']); const metas = useMemo(() => URLS.flatMap(url => data[lang === 'zh' ? url : `/en${url}`][0].children) - .filter(meta => meta.frontmatter.category === 'Components').map(meta => ({ - ...meta, - ...meta.frontmatter, - color: meta.frontmatter.type === ChartType.GRAPH ? "purple" : "volcano" - })).sort((a, b) => a.title.localeCompare(b.title)), [data, lang]); + .filter(meta => meta.frontmatter.category === 'Components') + .map(meta => { + const usageIds = (meta.frontmatter.usage || '').split(',').filter(usage => !isEmpty(usage)); + const usages = usagesData.filter(tag => usageIds.includes(tag.id)); + return { + ...meta, + ...meta.frontmatter, + usages, + } + }) + .filter(meta => selectedUsages.includes('all') || selectedUsages.every(usage => meta.usages.some(item => item.id === usage))) + .sort((a, b) => a.title.localeCompare(b.title)), [data, lang, selectedUsages]); + + const handleChange = (tag: string, checked: boolean) => { + let nextSelectedUsages; + + if (tag === 'all') { + nextSelectedUsages = checked ? ['all'] : []; + } else { + nextSelectedUsages = checked + ? [...selectedUsages.filter((t) => t !== 'all'), tag] + : selectedUsages.filter((t) => t !== tag); + + if (nextSelectedUsages.length === 0) { + nextSelectedUsages = ['all']; + } + } + + setSelectedUsages(nextSelectedUsages); + }; return - - {metas.map((meta, index) => - navigate(meta.link)} - hoverable - title={meta.title} - extra={{locale[meta.type]}} - style={{ borderRadius: 4 }} - > - - {meta.title} - - )} - + +
+ + + {usagesData.map(({ id, nameZh, nameEn }) => ( + handleChange(id, checked)} + > + {lang === 'zh' ? nameZh : nameEn} + + ))} + + +
+ + + {metas.map((meta, index) => { + return + navigate(meta.link)} + hoverable + title={meta.title} + style={{ borderRadius: 6 }} + + > + + {meta.title} + + + {meta.usages?.map((usage, index) =>
{ + lang === 'zh' ? usage.nameZh : usage.nameEn + }
)} +
+
+ })} +
+
}; diff --git a/site/docs/options/graphs/dendrogram.en.md b/site/docs/options/graphs/dendrogram.en.md index 40623c1a6..8435e059b 100644 --- a/site/docs/options/graphs/dendrogram.en.md +++ b/site/docs/options/graphs/dendrogram.en.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: relation title: Dendrogram cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*mvnUTaA91H0AAAAAAAAAAAAADmJ7AQ/original order: 3 diff --git a/site/docs/options/graphs/dendrogram.zh.md b/site/docs/options/graphs/dendrogram.zh.md index 593eb3093..3c02acb31 100644 --- a/site/docs/options/graphs/dendrogram.zh.md +++ b/site/docs/options/graphs/dendrogram.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: relation title: Dendrogram 生态树图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*mvnUTaA91H0AAAAAAAAAAAAADmJ7AQ/original order: 3 diff --git a/site/docs/options/graphs/flow-direction-graph.en.md b/site/docs/options/graphs/flow-direction-graph.en.md index 60663aeac..e4c4dbdef 100644 --- a/site/docs/options/graphs/flow-direction-graph.en.md +++ b/site/docs/options/graphs/flow-direction-graph.en.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: flow,relation title: FlowDirectionGraph cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*jOEPRKWxPE0AAAAAAAAAAAAADmJ7AQ/original order: 6 diff --git a/site/docs/options/graphs/flow-direction-graph.zh.md b/site/docs/options/graphs/flow-direction-graph.zh.md index 076302a45..79904b7b9 100644 --- a/site/docs/options/graphs/flow-direction-graph.zh.md +++ b/site/docs/options/graphs/flow-direction-graph.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: flow,relation title: FlowDirectionGraph 流向图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*jOEPRKWxPE0AAAAAAAAAAAAADmJ7AQ/original order: 6 diff --git a/site/docs/options/graphs/flow-graph.en.md b/site/docs/options/graphs/flow-graph.en.md index 58940210d..ab36d955b 100644 --- a/site/docs/options/graphs/flow-graph.en.md +++ b/site/docs/options/graphs/flow-graph.en.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: flow,relation title: FlowGraph cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*n9JgQIGi9BQAAAAAAAAAAAAADmJ7AQ/original order: 5 diff --git a/site/docs/options/graphs/flow-graph.zh.md b/site/docs/options/graphs/flow-graph.zh.md index df51100df..11dbd4eb6 100644 --- a/site/docs/options/graphs/flow-graph.zh.md +++ b/site/docs/options/graphs/flow-graph.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: flow,relation title: FlowGraph 流程图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*n9JgQIGi9BQAAAAAAAAAAAAADmJ7AQ/original order: 5 diff --git a/site/docs/options/graphs/indented-tree.en.md b/site/docs/options/graphs/indented-tree.en.md index 8818701a6..175412c53 100644 --- a/site/docs/options/graphs/indented-tree.en.md +++ b/site/docs/options/graphs/indented-tree.en.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: relation title: IndentedTree cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*JZZVT5PsWPQAAAAAAAAAAAAADmJ7AQ/original order: 2 diff --git a/site/docs/options/graphs/indented-tree.zh.md b/site/docs/options/graphs/indented-tree.zh.md index ae6910cb0..dd6bbe7a7 100644 --- a/site/docs/options/graphs/indented-tree.zh.md +++ b/site/docs/options/graphs/indented-tree.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: relation title: IndentedTree 缩进树图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*JZZVT5PsWPQAAAAAAAAAAAAADmJ7AQ/original order: 2 diff --git a/site/docs/options/graphs/mind-map.en.md b/site/docs/options/graphs/mind-map.en.md index ebc2f50f5..79b47896b 100644 --- a/site/docs/options/graphs/mind-map.en.md +++ b/site/docs/options/graphs/mind-map.en.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: relation title: MindMap cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*cce0Sa7DR3cAAAAAAAAAAAAADmJ7AQ/original order: 1 diff --git a/site/docs/options/graphs/mind-map.zh.md b/site/docs/options/graphs/mind-map.zh.md index 7be2f97ac..da004b879 100644 --- a/site/docs/options/graphs/mind-map.zh.md +++ b/site/docs/options/graphs/mind-map.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: relation title: MindMap 思维导图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*cce0Sa7DR3cAAAAAAAAAAAAADmJ7AQ/original order: 1 diff --git a/site/docs/options/graphs/network-graph.en.md b/site/docs/options/graphs/network-graph.en.md index 795be42f7..17aeda8df 100644 --- a/site/docs/options/graphs/network-graph.en.md +++ b/site/docs/options/graphs/network-graph.en.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: relation title: NetworkGraph cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*q9AkRIF8fF4AAAAAAAAAAAAADmJ7AQ/original order: 7 diff --git a/site/docs/options/graphs/network-graph.zh.md b/site/docs/options/graphs/network-graph.zh.md index 241f65130..f8d48bea8 100644 --- a/site/docs/options/graphs/network-graph.zh.md +++ b/site/docs/options/graphs/network-graph.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: relation title: NetworkGraph 网络图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*q9AkRIF8fF4AAAAAAAAAAAAADmJ7AQ/original order: 7 diff --git a/site/docs/options/graphs/organization-chart.en.md b/site/docs/options/graphs/organization-chart.en.md index 0778b2b36..178bfa3b2 100644 --- a/site/docs/options/graphs/organization-chart.en.md +++ b/site/docs/options/graphs/organization-chart.en.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: relation title: OrganizationChart cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*jgGCT7cMxg8AAAAAAAAAAAAADmJ7AQ/original order: 4 diff --git a/site/docs/options/graphs/organization-chart.zh.md b/site/docs/options/graphs/organization-chart.zh.md index 174636e65..2291175da 100644 --- a/site/docs/options/graphs/organization-chart.zh.md +++ b/site/docs/options/graphs/organization-chart.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Graph +usage: relation title: OrganizationChart 组织结构图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*jgGCT7cMxg8AAAAAAAAAAAAADmJ7AQ/original order: 4 diff --git a/site/docs/options/overview.zh.md b/site/docs/options/overview.zh.md index c2000fc75..0cd746f9c 100644 --- a/site/docs/options/overview.zh.md +++ b/site/docs/options/overview.zh.md @@ -1,5 +1,10 @@ --- -title: 📈 图表总览 +title: 📈 图表分类 +showToc: false --- +一提到图表,大家脑海里浮现的,通常是柱状图、饼图、趋势图等等。这是按照图形等维度对图表进行分类,经常会导致图表的误用。 + +图表的作用,是帮助我们更好地看懂数据。选择什么图表,需要回答的首要问题是 **「我有什么数据,需要用图表做什么」** , 而不是 **「图表长成什么样」**。因此我们从数据出发,从功能角度对图表进行分类。 + diff --git a/site/docs/options/plots/special/area.en.md b/site/docs/options/plots/special/area.en.md new file mode 100644 index 000000000..6cbe960f3 --- /dev/null +++ b/site/docs/options/plots/special/area.en.md @@ -0,0 +1,9 @@ +--- +category: Components +type: Plot +usage: comparison,distribution,interval,trend,time +title: Area +cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ZxtyTrhyN4sAAAAAAAAAAAAADmJ7AQ/original +link: /examples#statistics-area +order: 0 +--- diff --git a/site/docs/options/plots/special/area.zh.md b/site/docs/options/plots/special/area.zh.md new file mode 100644 index 000000000..e61f2ac15 --- /dev/null +++ b/site/docs/options/plots/special/area.zh.md @@ -0,0 +1,9 @@ +--- +category: Components +type: Plot +usage: comparison,distribution,interval,trend,time +title: Area 面积图 +cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ZxtyTrhyN4sAAAAAAAAAAAAADmJ7AQ/original +link: /examples#statistics-area +order: 0 +--- diff --git a/site/docs/options/plots/special/bar.en.md b/site/docs/options/plots/special/bar.en.md index a4e125b38..9403bcee8 100644 --- a/site/docs/options/plots/special/bar.en.md +++ b/site/docs/options/plots/special/bar.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: Bar cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*eU1cRqm_fPAAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-bar diff --git a/site/docs/options/plots/special/bar.zh.md b/site/docs/options/plots/special/bar.zh.md index c9cdca424..c30810836 100644 --- a/site/docs/options/plots/special/bar.zh.md +++ b/site/docs/options/plots/special/bar.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: Bar 条形图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*eU1cRqm_fPAAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-bar diff --git a/site/docs/options/plots/special/bidirectional-bar.en.md b/site/docs/options/plots/special/bidirectional-bar.en.md index a46b4114f..032528138 100644 --- a/site/docs/options/plots/special/bidirectional-bar.en.md +++ b/site/docs/options/plots/special/bidirectional-bar.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: BidirectionalBar cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*19M9So-1OpoAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-bidirectional-bar diff --git a/site/docs/options/plots/special/bidirectional-bar.zh.md b/site/docs/options/plots/special/bidirectional-bar.zh.md index c730dbd03..898beff10 100644 --- a/site/docs/options/plots/special/bidirectional-bar.zh.md +++ b/site/docs/options/plots/special/bidirectional-bar.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: BidirectionalBar 对称条形图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*19M9So-1OpoAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-bidirectional-bar diff --git a/site/docs/options/plots/special/box.en.md b/site/docs/options/plots/special/box.en.md index f16b11eb1..97a743b31 100644 --- a/site/docs/options/plots/special/box.en.md +++ b/site/docs/options/plots/special/box.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: distribution title: Box cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*A746SrYUxbsAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-box diff --git a/site/docs/options/plots/special/box.zh.md b/site/docs/options/plots/special/box.zh.md index 0292b58b0..0fea88bbe 100644 --- a/site/docs/options/plots/special/box.zh.md +++ b/site/docs/options/plots/special/box.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: distribution title: Box 箱线图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*A746SrYUxbsAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-box diff --git a/site/docs/options/plots/special/bullet.en.md b/site/docs/options/plots/special/bullet.en.md index 9c5f5ec05..1a64b7681 100644 --- a/site/docs/options/plots/special/bullet.en.md +++ b/site/docs/options/plots/special/bullet.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: Bullet cover: https://mdn.alipayobjects.com/huamei_za7we3/afts/img/A*R4hCRJwwMhgAAAAAAAAAAAAADo2bAQ/original link: /examples#statistics-bullet diff --git a/site/docs/options/plots/special/bullet.zh.md b/site/docs/options/plots/special/bullet.zh.md index c754178bc..46f614e4e 100644 --- a/site/docs/options/plots/special/bullet.zh.md +++ b/site/docs/options/plots/special/bullet.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: Bullet 子弹图 cover: https://mdn.alipayobjects.com/huamei_za7we3/afts/img/A*R4hCRJwwMhgAAAAAAAAAAAAADo2bAQ/original link: /examples#statistics-bullet diff --git a/site/docs/options/plots/special/column.en.md b/site/docs/options/plots/special/column.en.md index 33205b047..ce7693e5b 100644 --- a/site/docs/options/plots/special/column.en.md +++ b/site/docs/options/plots/special/column.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: Column cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*X_B0Q7Co9xEAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-column diff --git a/site/docs/options/plots/special/column.zh.md b/site/docs/options/plots/special/column.zh.md index 9cf078493..9edf0992e 100644 --- a/site/docs/options/plots/special/column.zh.md +++ b/site/docs/options/plots/special/column.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: Column 柱状图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*X_B0Q7Co9xEAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-column diff --git a/site/docs/options/plots/special/dual-axes.en.md b/site/docs/options/plots/special/dual-axes.en.md index 514437598..34c27cdb8 100644 --- a/site/docs/options/plots/special/dual-axes.en.md +++ b/site/docs/options/plots/special/dual-axes.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison,trend,time title: DualAxes cover: https://mdn.alipayobjects.com/mdn/huamei_qa8qxu/afts/img/A*GLvKQbqMjTQAAAAAAAAAAAAADmJ7AQ/fmt.webp link: /examples#statistics-dual-axes diff --git a/site/docs/options/plots/special/dual-axes.zh.md b/site/docs/options/plots/special/dual-axes.zh.md index 88d34bdc6..6a66d2238 100644 --- a/site/docs/options/plots/special/dual-axes.zh.md +++ b/site/docs/options/plots/special/dual-axes.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison,trend,time title: DualAxes 双轴图 cover: https://mdn.alipayobjects.com/mdn/huamei_qa8qxu/afts/img/A*GLvKQbqMjTQAAAAAAAAAAAAADmJ7AQ/fmt.webp link: /examples#statistics-dual-axes diff --git a/site/docs/options/plots/special/funnel.en.md b/site/docs/options/plots/special/funnel.en.md index 8f092b89d..7d2e3e8be 100644 --- a/site/docs/options/plots/special/funnel.en.md +++ b/site/docs/options/plots/special/funnel.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: flow,comparison title: Funnel cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*VHVOTK8LhxkAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-funnel diff --git a/site/docs/options/plots/special/funnel.zh.md b/site/docs/options/plots/special/funnel.zh.md index 08a22847b..8e2e6533f 100644 --- a/site/docs/options/plots/special/funnel.zh.md +++ b/site/docs/options/plots/special/funnel.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: flow,comparison title: Funnel 漏斗图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*VHVOTK8LhxkAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-funnel diff --git a/site/docs/options/plots/special/gauge.en.md b/site/docs/options/plots/special/gauge.en.md index b75b4ed26..c24a4cb91 100644 --- a/site/docs/options/plots/special/gauge.en.md +++ b/site/docs/options/plots/special/gauge.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: interval title: Gauge cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*hpjTRr6LM7IAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-gauge diff --git a/site/docs/options/plots/special/gauge.zh.md b/site/docs/options/plots/special/gauge.zh.md index 3e745c1b7..0d31b7cc8 100644 --- a/site/docs/options/plots/special/gauge.zh.md +++ b/site/docs/options/plots/special/gauge.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: interval title: Gauge 仪表盘 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*hpjTRr6LM7IAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-gauge diff --git a/site/docs/options/plots/special/heatmap.en.md b/site/docs/options/plots/special/heatmap.en.md index 1d1c950a2..18087d994 100644 --- a/site/docs/options/plots/special/heatmap.en.md +++ b/site/docs/options/plots/special/heatmap.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: distribution title: Heatmap cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*oaJCT5yVPRsAAAAAAAAAAAAADmJ7AQ/original order: 7 diff --git a/site/docs/options/plots/special/heatmap.zh.md b/site/docs/options/plots/special/heatmap.zh.md index 495abb38e..e91f3efef 100644 --- a/site/docs/options/plots/special/heatmap.zh.md +++ b/site/docs/options/plots/special/heatmap.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: distribution title: Heatmap 热力图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*oaJCT5yVPRsAAAAAAAAAAAAADmJ7AQ/original order: 7 diff --git a/site/docs/options/plots/special/histogram.en.md b/site/docs/options/plots/special/histogram.en.md index 0a193fb2e..1a11fdd5b 100644 --- a/site/docs/options/plots/special/histogram.en.md +++ b/site/docs/options/plots/special/histogram.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison,distribution title: Histogram cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*yTCIRruhfOoAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-histogram diff --git a/site/docs/options/plots/special/histogram.zh.md b/site/docs/options/plots/special/histogram.zh.md index 778de7869..042e104c3 100644 --- a/site/docs/options/plots/special/histogram.zh.md +++ b/site/docs/options/plots/special/histogram.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison,distribution title: Histogram 直方图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*yTCIRruhfOoAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-histogram diff --git a/site/docs/options/plots/special/line.en.md b/site/docs/options/plots/special/line.en.md new file mode 100644 index 000000000..79fc91324 --- /dev/null +++ b/site/docs/options/plots/special/line.en.md @@ -0,0 +1,9 @@ +--- +category: Components +type: Plot +usage: trend,time +title: Line +cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*EH-dTLnE4bcAAAAAAAAAAAAADmJ7AQ/original +link: /examples#statistics-line +order: 0 +--- diff --git a/site/docs/options/plots/special/line.zh.md b/site/docs/options/plots/special/line.zh.md new file mode 100644 index 000000000..8e4bc9c7b --- /dev/null +++ b/site/docs/options/plots/special/line.zh.md @@ -0,0 +1,9 @@ +--- +category: Components +type: Plot +usage: trend,time +title: Line 折线图 +cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*EH-dTLnE4bcAAAAAAAAAAAAADmJ7AQ/original +link: /examples#statistics-line +order: 0 +--- diff --git a/site/docs/options/plots/special/pie.en.md b/site/docs/options/plots/special/pie.en.md index af7cfb347..78d62a980 100644 --- a/site/docs/options/plots/special/pie.en.md +++ b/site/docs/options/plots/special/pie.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: proportion title: Pie cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*DSItR6amdjMAAAAAAAAAAAAADmJ7AQ/original order: 2 diff --git a/site/docs/options/plots/special/pie.zh.md b/site/docs/options/plots/special/pie.zh.md index 86cdf32fc..dd1473cea 100644 --- a/site/docs/options/plots/special/pie.zh.md +++ b/site/docs/options/plots/special/pie.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: proportion title: Pie 饼图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*DSItR6amdjMAAAAAAAAAAAAADmJ7AQ/original order: 2 diff --git a/site/docs/options/plots/special/radar.en.md b/site/docs/options/plots/special/radar.en.md index 1b12df34f..5e525cba3 100644 --- a/site/docs/options/plots/special/radar.en.md +++ b/site/docs/options/plots/special/radar.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: Radar cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*okGTT7D7fBEAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-radar diff --git a/site/docs/options/plots/special/radar.zh.md b/site/docs/options/plots/special/radar.zh.md index 81835a294..ba0b60704 100644 --- a/site/docs/options/plots/special/radar.zh.md +++ b/site/docs/options/plots/special/radar.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: Radar 雷达图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*okGTT7D7fBEAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-radar diff --git a/site/docs/options/plots/special/radial-bar.en.md b/site/docs/options/plots/special/radial-bar.en.md index 764302c08..2722b4651 100644 --- a/site/docs/options/plots/special/radial-bar.en.md +++ b/site/docs/options/plots/special/radial-bar.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: RadialBar cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*-1GkR6WftskAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-radial-bar diff --git a/site/docs/options/plots/special/radial-bar.zh.md b/site/docs/options/plots/special/radial-bar.zh.md index cca0f8b97..d0e6dc69c 100644 --- a/site/docs/options/plots/special/radial-bar.zh.md +++ b/site/docs/options/plots/special/radial-bar.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: RadialBar 玉珏图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*-1GkR6WftskAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-radial-bar diff --git a/site/docs/options/plots/special/rose.en.md b/site/docs/options/plots/special/rose.en.md index d2a3da54a..f707c0649 100644 --- a/site/docs/options/plots/special/rose.en.md +++ b/site/docs/options/plots/special/rose.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: Rose cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Cx8zT7vT5bUAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-rose diff --git a/site/docs/options/plots/special/rose.zh.md b/site/docs/options/plots/special/rose.zh.md index 9a85d569f..fbb973f55 100644 --- a/site/docs/options/plots/special/rose.zh.md +++ b/site/docs/options/plots/special/rose.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison title: Rose 玫瑰图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Cx8zT7vT5bUAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-rose diff --git a/site/docs/options/plots/special/sankey.en.md b/site/docs/options/plots/special/sankey.en.md index 12fc608b2..50500e362 100644 --- a/site/docs/options/plots/special/sankey.en.md +++ b/site/docs/options/plots/special/sankey.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: flow,relation title: Sankey cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*fecqTpstXu0AAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-sankey diff --git a/site/docs/options/plots/special/sankey.zh.md b/site/docs/options/plots/special/sankey.zh.md index 1a408486d..d091d1909 100644 --- a/site/docs/options/plots/special/sankey.zh.md +++ b/site/docs/options/plots/special/sankey.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: flow,relation title: Sankey 桑基图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*fecqTpstXu0AAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-sankey diff --git a/site/docs/options/plots/special/scatter.en.md b/site/docs/options/plots/special/scatter.en.md index 5936cb843..c4bd285ef 100644 --- a/site/docs/options/plots/special/scatter.en.md +++ b/site/docs/options/plots/special/scatter.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: distribution,comparison title: Scatter cover: https://mdn.alipayobjects.com/mdn/huamei_qa8qxu/afts/img/A*u5aGSoyRDN8AAAAAAAAAAAAADmJ7AQ link: /examples#statistics-scatter diff --git a/site/docs/options/plots/special/scatter.zh.md b/site/docs/options/plots/special/scatter.zh.md index b91afe6ec..dd68cbb7d 100644 --- a/site/docs/options/plots/special/scatter.zh.md +++ b/site/docs/options/plots/special/scatter.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: distribution,comparison title: Scatter 散点图 cover: https://mdn.alipayobjects.com/mdn/huamei_qa8qxu/afts/img/A*u5aGSoyRDN8AAAAAAAAAAAAADmJ7AQ link: /examples#statistics-scatter diff --git a/site/docs/options/plots/special/stock.en.md b/site/docs/options/plots/special/stock.en.md index f259d7ebf..493e2dad3 100644 --- a/site/docs/options/plots/special/stock.en.md +++ b/site/docs/options/plots/special/stock.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison,trend,time title: Stock cover: https://mdn.alipayobjects.com/mdn/huamei_qa8qxu/afts/img/A*u5aGSoyRDN8AAAAAAAAAAAAADmJ7AQ link: /examples#statistics-stock diff --git a/site/docs/options/plots/special/stock.zh.md b/site/docs/options/plots/special/stock.zh.md index d607c26f8..933572c7f 100644 --- a/site/docs/options/plots/special/stock.zh.md +++ b/site/docs/options/plots/special/stock.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison,trend,time title: Stock 股票图 cover: https://mdn.alipayobjects.com/mdn/huamei_qa8qxu/afts/img/A*u5aGSoyRDN8AAAAAAAAAAAAADmJ7AQ link: /examples#statistics-stock diff --git a/site/docs/options/plots/special/sunburst.en.md b/site/docs/options/plots/special/sunburst.en.md index cf6a1900f..15574ddfb 100644 --- a/site/docs/options/plots/special/sunburst.en.md +++ b/site/docs/options/plots/special/sunburst.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: distribution,relation,interval title: Sunburst cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*GBxdT697NYQAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-sunburst diff --git a/site/docs/options/plots/special/sunburst.zh.md b/site/docs/options/plots/special/sunburst.zh.md index 51b3fc4c6..154aa2c59 100644 --- a/site/docs/options/plots/special/sunburst.zh.md +++ b/site/docs/options/plots/special/sunburst.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: distribution,relation,interval title: Sunburst 旭日图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*GBxdT697NYQAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-sunburst diff --git a/site/docs/options/plots/special/treemap.en.md b/site/docs/options/plots/special/treemap.en.md index 9470fb2c0..ec6503716 100644 --- a/site/docs/options/plots/special/treemap.en.md +++ b/site/docs/options/plots/special/treemap.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison,distribution,relation title: Treemap cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*T2zHS6J1cGMAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-treemap diff --git a/site/docs/options/plots/special/treemap.zh.md b/site/docs/options/plots/special/treemap.zh.md index dbe9022dc..284883c6f 100644 --- a/site/docs/options/plots/special/treemap.zh.md +++ b/site/docs/options/plots/special/treemap.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: comparison,distribution,relation title: Treemap 矩阵树图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*T2zHS6J1cGMAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-treemap diff --git a/site/docs/options/plots/special/venn.en.md b/site/docs/options/plots/special/venn.en.md index 6e26765b3..52715af4b 100644 --- a/site/docs/options/plots/special/venn.en.md +++ b/site/docs/options/plots/special/venn.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: relation title: Venn cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*I7XlS4ps7IcAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-venn diff --git a/site/docs/options/plots/special/venn.zh.md b/site/docs/options/plots/special/venn.zh.md index 8ca268080..b43e8842a 100644 --- a/site/docs/options/plots/special/venn.zh.md +++ b/site/docs/options/plots/special/venn.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: relation title: Venn 韦恩图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*I7XlS4ps7IcAAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-venn diff --git a/site/docs/options/plots/special/word-cloud.en.md b/site/docs/options/plots/special/word-cloud.en.md index 67f2eda84..c7a01f2e9 100644 --- a/site/docs/options/plots/special/word-cloud.en.md +++ b/site/docs/options/plots/special/word-cloud.en.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: distribution title: WordCloud cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*hC4uR6yuBa4AAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-wordCloud diff --git a/site/docs/options/plots/special/word-cloud.zh.md b/site/docs/options/plots/special/word-cloud.zh.md index d3091b31e..6378048b2 100644 --- a/site/docs/options/plots/special/word-cloud.zh.md +++ b/site/docs/options/plots/special/word-cloud.zh.md @@ -1,6 +1,7 @@ --- category: Components type: Plot +usage: distribution title: WordCloud 词云图 cover: https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*hC4uR6yuBa4AAAAAAAAAAAAADmJ7AQ/original link: /examples#statistics-wordCloud diff --git a/site/package.json b/site/package.json index cce931f74..15aca954e 100644 --- a/site/package.json +++ b/site/package.json @@ -29,14 +29,18 @@ }, "devDependencies": { "@antv/dumi-theme-antv": "^0.5.3", + "@types/lodash": "^4.17.7", "@types/react": "^16.14.8", "@types/react-dom": "^16.9.13", + "@types/styled-components": "^5.1.34", "cross-env": "^7.0.3", "d3-interpolate": "^3.0.1", "d3-regression": "^1.3.10", "dumi": "^2.1.14", "fecha": "^4.2.3", "gh-pages": "^2.1.1", + "lodash": "^4.17.21", + "styled-components": "^6.1.13", "typedoc": "^0.17.6", "typedoc-plugin-markdown": "^2.2.11", "typescript": "^3.6.5" @@ -46,7 +50,6 @@ "@ant-design/plots": "workspace:*", "antd": "^5.20.5", "insert-css": "^2.0.0", - "lodash": "^4.17.21", "rc-util": "^5.43.0", "react": "^18.3.1", "react-dom": "^18.3.1"