官网示例 API 和 Spec 互转
- Dominant language
- TypeScript
- Stars
- 12.6k
- Forks
- 1.7k
- PR merge metrics
- No merged PRs in 30d
Description
### AntV Open Source Contribution Plan(可选)
- [X] 我同意将这个 Issue 参与 OSCP 计划
### Issue 类型
高级任务
### 任务介绍
提供一个脚本、工具或者浏览器插件,支持官网 API 和 Spec 模式代码互转(API 转 Spec 优先级高)。
## API
```ts
import { Chart } from '@antv/g2';
const data = [
{ year: '1951 年', sales: 38 },
{ year: '1952 年', sales: 52 },
{ year: '1956 年', sales: 61 },
{ year: '1957 年', sales: 145 },
{ year: '1958 年', sales: 48 },
{ year: '1959 年', sales: 38 },
{ year: '1960 年', sales: 38 },
{ year: '1962 年', sales: 38 },
];
const chart = new Chart({
container: 'container',
autoFit: true,
});
chart
.interval()
.coordinate({ transform: [{ type: 'transpose' }] })
.data(data)
.encode('x', 'year')
.encode('y', 'sales');
chart.render();
```
## Spec
```ts
import { Chart } from "@antv/g2";
const chart = new Chart({ container: "container" });
chart.options({
type: "interval",
autoFit: true,
data: [
{ year: "1951 年", sales: 38 },
{ year: "1952 年", sales: 52 },
{ year: "1956 年", sales: 61 },
{ year: "1957 年", sales: 145 },
{ year: "1958 年", sales: 48 },
{ year: "1959 年", sales: 38 },
{ year: "1960 年", sales: 38 },
{ year: "1962 年", sales: 38 },
],
encode: { x: "year", y: "sales" },
coordinate: { transform: [{ type: "transpose" }] },
});
chart.render();
```
### 参考说明
_No response_
Contributor guide
Research direction
No files, tests, or entry points are named. Start by comparing the API and Spec examples in the issue and inspect the G2 documentation tooling to determine where conversion belongs; done means a script, tool, or browser plugin can reliably convert API examples to Spec form, with API-to-Spec support prioritized.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- data-visualization, tooling
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100