diff --git a/docs/common/chart-options.en.md b/docs/common/chart-options.en.md new file mode 100644 index 0000000000..f288f0156a --- /dev/null +++ b/docs/common/chart-options.en.md @@ -0,0 +1,51 @@ +#### width + +**可选** _number_ + +功能描述:设置图表宽度。 + +默认配置:`400` + +#### height + +**可选** _number_ + +功能描述:设置图表高度。 + +默认配置:`400` + +#### autoFit + +**可选** _boolean_ + +功能描述:图表是否自适应容器宽高。当 `autoFit` 设置为 true 时,`width` 和 `height` 的设置将失效。 + +默认配置:`true` + +#### padding + +**可选** _number[] | number | 'auto'_ + +功能描述: 画布的 `padding` 值,或者开启 `auto`。 + +#### appendPadding + +**可选** _number[] | number_ + +功能描述: 额外增加的 `appendPadding` 值。 + +#### renderer + +**可选** _string_ + +功能描述: 设置图表渲染方式为 `canvas` 或 `svg`。 + +默认配置: `canvas` + +#### pixelRatio + +**可选** _number_ + +功能描述: 设置图表渲染的像素比。 + +默认配置: `window.devicePixelRatio` diff --git a/docs/common/chart-options.zh.md b/docs/common/chart-options.zh.md new file mode 100644 index 0000000000..1661057523 --- /dev/null +++ b/docs/common/chart-options.zh.md @@ -0,0 +1,53 @@ + + +#### width + +**可选** _number_ + +功能描述:设置图表宽度。 + +默认配置:`400` + +#### height + +**可选** _number_ + +功能描述:设置图表高度。 + +默认配置:`400` + +#### autoFit + +**可选** _boolean_ + +功能描述:图表是否自适应容器宽高。当 `autoFit` 设置为 true 时,`width` 和 `height` 的设置将失效。 + +默认配置:`true` + +#### padding + +**可选** _number[] | number | 'auto'_ + +功能描述: 画布的 `padding` 值,或者开启 `auto`。 + +#### appendPadding + +**可选** _number[] | number_ + +功能描述: 额外增加的 `appendPadding` 值。 + +#### renderer + +**可选** _string_ + +功能描述: 设置图表渲染方式为 `canvas` 或 `svg`。 + +默认配置: `canvas` + +#### pixelRatio + +**可选** _number_ + +功能描述: 设置图表渲染的像素比。 + +默认配置: `window.devicePixelRatio` diff --git a/examples/scatter/basic/API.en.md b/examples/scatter/basic/API.en.md index ab057f6316..72b149535c 100644 --- a/examples/scatter/basic/API.en.md +++ b/examples/scatter/basic/API.en.md @@ -2,65 +2,15 @@ title: API --- -# 配置属性 +## 配置属性 -## 图表容器 +### 图表容器 -### width +`markdown:common/chart-options.en.md` -**可选**, _number_ +### 数据映射 -功能描述: 设置图表宽度。 - -默认配置: `400` - -### height - -**可选**, _number_ - -功能描述: 设置图表高度。 - -默认配置: `400` - -### autoFit - -**可选**, _boolean_ - -功能描述: 画布是否自动适配容器大小,当 `autoFit` 设置为 true 时,`width` 和 `height` 的设置将失效。 - -默认配置: `true` - -### padding - -**可选**, number[] | number | 'auto' - -功能描述: 画布的 `padding` 值,或者开启 `auto` - -### appendPadding - -**可选**, number[] | number - -功能描述: 额外怎加的 `appendPadding` 值 - -### renderer - -**可选**, _string_ - -功能描述: 设置图表渲染方式为 `canvas` 或 `svg` - -默认配置: `canvas` - -### pixelRatio - -**可选**, number - -功能描述: 设置图表渲染的像素比 - -默认配置: `window.devicePixelRatio` - -## 数据映射 - -### data 📌 +#### data 📌 **必选**, _array object_ @@ -70,7 +20,7 @@ title: API 数据源为对象集合,例如:`[{ time: '1991',value: 20 }, { time: '1992',value: 20 }]`。 -### meta +#### meta **可选**, _object_ @@ -115,7 +65,7 @@ scatterPlot.render(); ``` -### xField 📌 +#### xField 📌 **必选**, _string_ @@ -123,7 +73,7 @@ scatterPlot.render(); 默认配置: 无 -### yField 📌 +#### yField 📌 **必选**, _string_ @@ -131,23 +81,23 @@ scatterPlot.render(); 默认配置: 无 -### type +#### type -**可选**, `jitter` | `stack` | `symmetric` | `dodge`; +**可选**, _jitter | stack | symmetric | dodge_; 功能描述: 数据调整类型,不建议修改。 默认配置: `jitter` -### colorField +#### colorField **可选**, _string_ 功能描述: 点颜色映射对应的数据字段名。 -## 图形样式 +### 图形样式 -### color +#### color **可选**, _string | string[] | Function_ @@ -174,16 +124,17 @@ color: (type) => { }, ``` -### sizeField +#### sizeField **可选**, _string_ 功能描述: 点大小映射对应的数据字段名。 -### size ✨ +#### size ✨ -_ -**可选**, \_number | [number, number] | Function_ +[**DEMO1**](../../scatter/basic#color-mapping) + +**可选**, \_number | [number, number] | Function\_ 功能描述: 指定点的大小。如没有配置 sizeField,指定一个即可。对 sizeFiled 进行了配置的情况下,可以指定大小数组 `[minSize, maxSize]`, 也可以通过回调函数的方法根据对应数值进行设置。 @@ -201,16 +152,17 @@ size: (weight) => { }, ``` -### shapeField +#### shapeField **可选**, _string_ 功能描述: 点形状映射对应的数据字段名。 -### shape ✨ +#### shape ✨ + +[**DEMO2**](../../scatter/basic#shape-mapping) -_ -**可选**, \_string | string[] | Function_ +**可选**, \_string | string[] | Function\_ 功能描述: 指定点的形状。如没有配置 shapeField ,指定一个即可。对 shapeField 进行了配置的情况下,可以指定形状数组 `['cicle', 'square']`, 也可以通过回调函数的方法根据对应数值进行设置。 @@ -233,7 +185,7 @@ shape: (gender) => { }, ``` -### pointStyle ✨ +#### pointStyle ✨ **可选**, _object_ @@ -278,15 +230,20 @@ pointStyle: (x, y, colorField) => { }; ``` -## 图表组件 +### 图表组件 -`xAxis`、`yAxis` 、`legend` 、`tooltip` 、`label`、`theme` 等通用组件请参考图表通用配置 +`markdown:common/tooltip.en.md` +`markdown:common/xAxis.en.md` +`markdown:common/yAxis.en.md` +`markdown:common/xAxis.en.md` +`markdown:common/legend.en.md` +`markdown:common/theme.en.md` -## 事件 +### 事件 -[通用 events](../../general/events/API) +`markdown:common/events.en.md` -### 点图形事件 +#### 点图形事件 | onPointClick
点点击事件 | onPointDblClick
点双击事件 | onPointDblClick
点双击事件 | onPointMouseleave
点鼠标离开事件 | | ------------------------------------ | ----------------------------------- | ---------------------------------- | ------------------------------------- | diff --git a/examples/scatter/basic/API.zh.md b/examples/scatter/basic/API.zh.md index 31b5b049bc..4bf8dc8b3f 100644 --- a/examples/scatter/basic/API.zh.md +++ b/examples/scatter/basic/API.zh.md @@ -2,65 +2,15 @@ title: API --- -# 配置属性 +## 配置属性 -## 图表容器 +### 图表容器 -### width +`markdown:common/chart-options.zh.md` -**可选**, _number_ +### 数据映射 -功能描述: 设置图表宽度。 - -默认配置: `400` - -### height - -**可选**, _number_ - -功能描述: 设置图表高度。 - -默认配置: `400` - -### autoFit - -**可选**, _boolean_ - -功能描述: 画布是否自动适配容器大小,当 `autoFit` 设置为 true 时,`width` 和 `height` 的设置将失效。 - -默认配置: `true` - -### padding - -**可选**, number[] | number | 'auto' - -功能描述: 画布的 `padding` 值,或者开启 `auto` - -### appendPadding - -**可选**, number[] | number - -功能描述: 额外增加的 `appendPadding` 值 - -### renderer - -**可选**, _string_ - -功能描述: 设置图表渲染方式为 `canvas` 或 `svg` - -默认配置: `canvas` - -### pixelRatio - -**可选**, number - -功能描述: 设置图表渲染的像素比 - -默认配置: `window.devicePixelRatio` - -## 数据映射 - -### data 📌 +#### data 📌 **必选**, _array object_ @@ -70,7 +20,7 @@ title: API 数据源为对象集合,例如:`[{ time: '1991',value: 20 }, { time: '1992',value: 20 }]`。 -### meta +#### meta **可选**, _object_ @@ -115,7 +65,7 @@ scatterPlot.render(); ``` -### xField 📌 +#### xField 📌 **必选**, _string_ @@ -123,7 +73,7 @@ scatterPlot.render(); 默认配置: 无 -### yField 📌 +#### yField 📌 **必选**, _string_ @@ -131,7 +81,7 @@ scatterPlot.render(); 默认配置: 无 -### type +#### type **可选**, _jitter | stack | symmetric | dodge_; @@ -139,15 +89,15 @@ scatterPlot.render(); 默认配置: `jitter` -### colorField +#### colorField **可选**, _string_ 功能描述: 点颜色映射对应的数据字段名。 -## 图形样式 +### 图形样式 -### color +#### color **可选**, _string | string[] | Function_ @@ -174,13 +124,13 @@ color: (type) => { }, ``` -### sizeField +#### sizeField **可选**, _string_ 功能描述: 点大小映射对应的数据字段名。 -### size ✨ +#### size ✨ [**DEMO1**](../../scatter/basic#color-mapping) @@ -202,13 +152,13 @@ size: (weight) => { }, ``` -### shapeField +#### shapeField **可选**, _string_ 功能描述: 点形状映射对应的数据字段名。 -### shape ✨ +#### shape ✨ [**DEMO2**](../../scatter/basic#shape-mapping) @@ -235,7 +185,7 @@ shape: (gender) => { }, ``` -### pointStyle ✨ +#### pointStyle ✨ **可选**, _object_ @@ -280,15 +230,20 @@ pointStyle: (x, y, colorField) => { }; ``` -## 图表组件 +### 图表组件 -`xAxis`、`yAxis` 、`legend` 、`tooltip` 、`label`、`theme` 等通用组件请参考图表通用配置 +`markdown:common/tooltip.zh.md` +`markdown:common/xAxis.zh.md` +`markdown:common/yAxis.zh.md` +`markdown:common/xAxis.zh.md` +`markdown:common/legend.zh.md` +`markdown:common/theme.zh.md` -## 事件 +### 事件 -[通用 events]() +`markdown:common/events.zh.md` -### 点图形事件 +#### 点图形事件 | onPointClick
点点击事件 | onPointDblClick
点双击事件 | onPointDblClick
点双击事件 | onPointMouseleave
点鼠标离开事件 | | ------------------------------------ | ----------------------------------- | ---------------------------------- | ------------------------------------- | diff --git a/package.json b/package.json index 7971eecb29..c43bf2d4fe 100644 --- a/package.json +++ b/package.json @@ -59,7 +59,7 @@ "tslib": "^1.13.0" }, "devDependencies": { - "@antv/gatsby-theme-antv": "^0.10.69", + "@antv/gatsby-theme-antv": "^1.0.0-beta.0", "@babel/core": "^7.10.4", "@babel/preset-env": "^7.10.4", "@commitlint/cli": "^8.2.0",