Skip to content

Commit

Permalink
add axis demos
Browse files Browse the repository at this point in the history
  • Loading branch information
@paleface001
paleface001 committed Nov 15, 2019
1 parent 23edd65 commit bbea503
Show file tree
Hide file tree
Showing 11 changed files with 254 additions and 0 deletions.
13 changes: 13 additions & 0 deletions examples/general/axis/API.en.md
View file
@@ -0,0 +1,13 @@
---
title: API
---

API.

- Modern browsers and Internet Explorer 9+ (with [polyfills](https:// ant.design/docs/react/getting-started#Compatibility))
- Server-side Rendering
- [Electron](http:// electron.atom.io/)

| [src as img="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http:// godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png" alt="Electron" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Electron |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| IE9, IE10, IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
13 changes: 13 additions & 0 deletions examples/general/axis/API.zh.md
View file
@@ -0,0 +1,13 @@
---
title: API
---

API 信息。

- Modern browsers and Internet Explorer 9+ (with [polyfills](https:// ant.design/docs/react/getting-started#Compatibility))
- Server-side Rendering
- [Electron](http:// electron.atom.io/)

| [src as img="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http:// godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png" alt="Electron" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Electron |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| IE9, IE10, IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
34 changes: 34 additions & 0 deletions examples/general/axis/demo/axis-minmax.js
View file
@@ -0,0 +1,34 @@
import { Line } from '@antv/g2plot';

fetch('https://gw.alipayobjects.com/os/antvdemo/assets/data/fertility.json')
.then((res) => res.json())
.then((data) => {
const linePlot = new Line(document.getElementById('container'), {
title: {
visible: true,
text: '配置坐标轴最大值和最小值',
},
description: {
visible: true,
},
forceFit: true,
data,
padding: 'auto',
xField: 'year',
yField: 'value',
seriesField: 'country',
smooth: true,
xAxis: {
visible: true,
type: 'dateTime',
tickCount: 5,
},
yAxis: {
visible: true,
min: 3,
max: 7,
},
});

linePlot.render();
});
87 changes: 87 additions & 0 deletions examples/general/axis/demo/axis-style.js
View file
@@ -0,0 +1,87 @@
import { Line } from '@antv/g2plot';

fetch('https://gw.alipayobjects.com/os/antvdemo/assets/data/fertility.json')
.then((res) => res.json())
.then((data) => {
const linePlot = new Line(document.getElementById('container'), {
title: {
visible: true,
text: '配置坐标轴样式',
},
description: {
visible: true,
},
forceFit: true,
data,
padding: 'auto',
xField: 'year',
yField: 'value',
seriesField: 'country',
smooth: true,
xAxis: {
visible: true,
type: 'time',
grid: {
visible: true,
style: {
stroke: '#e3e8ec',
lineWidth: 1,
lineDash: [0, 0],
},
},
line: {
visible: true,
style: {
stroke: 'black',
lineWidth: 1,
},
},
tickLine: {
visible: true,
style: {
stroke: 'black',
lineWidth: 1,
},
},
label: {
visible: true,
style: {
fill: 'black',
},
},
},
yAxis: {
visible: true,
grid: {
visible: true,
style: {
stroke: '#e3e8ec',
lineWidth: 1,
lineDash: [0, 0],
},
},
line: {
visible: true,
style: {
stroke: 'black',
lineWidth: 1,
},
},
tickLine: {
visible: true,
style: {
stroke: 'black',
lineWidth: 1,
},
},
label: {
visible: true,
style: {
fill: 'black',
},
},
},
});

linePlot.render();
});
25 changes: 25 additions & 0 deletions examples/general/axis/demo/axis-tickCount.js
View file
@@ -0,0 +1,25 @@
import { Line } from '@antv/g2plot';

fetch('https://gw.alipayobjects.com/os/antvdemo/assets/data/fertility.json')
.then((res) => res.json())
.then((data) => {
const linePlot = new Line(document.getElementById('container'), {
title: {
visible: true,
text: '配置坐标轴tick数量',
},
forceFit: true,
data,
padding: 'auto',
xField: 'year',
yField: 'value',
seriesField: 'country',
smooth: true,
xAxis: {
type: 'dateTime',
tickCount: 5,
},
});

linePlot.render();
});
34 changes: 34 additions & 0 deletions examples/general/axis/demo/axis-title.js
View file
@@ -0,0 +1,34 @@
import { Line } from '@antv/g2plot';

fetch('https://gw.alipayobjects.com/os/antvdemo/assets/data/fertility.json')
.then((res) => res.json())
.then((data) => {
const linePlot = new Line(document.getElementById('container'), {
title: {
visible: true,
text: '配置坐标轴标题',
},
forceFit: true,
data,
padding: 'auto',
xField: 'year',
yField: 'value',
seriesField: 'country',
smooth: true,
xAxis: {
visible: true,
type: 'dateTime',
title: {
text: 'x轴标题',
},
},
yAxis: {
visible: true,
title: {
text: 'y轴标题',
},
},
});

linePlot.render();
});
28 changes: 28 additions & 0 deletions examples/general/axis/demo/meta.json
View file
@@ -0,0 +1,28 @@
{
"title": {
"zh": "中文分类",
"en": "Category"
},
"demos": [
{
"filename": "axis-tickCount.js",
"title": "配置坐标轴tick数量",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*R6NWS4aNqPMAAAAAAAAAAABkARQnAQ"
},
{
"filename": "axis-minmax.js",
"title": "配置坐标轴最大值最小值",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*R6NWS4aNqPMAAAAAAAAAAABkARQnAQ"
},
{
"filename": "axis-title.js",
"title": "配置坐标轴标题",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*R6NWS4aNqPMAAAAAAAAAAABkARQnAQ"
},
{
"filename": "axis-style.js",
"title": "配置坐标轴样式",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*R6NWS4aNqPMAAAAAAAAAAABkARQnAQ"
}
]
}
5 changes: 5 additions & 0 deletions examples/general/axis/design.en.md
View file
@@ -0,0 +1,5 @@
---
title: 设计规范
---

设计规范
5 changes: 5 additions & 0 deletions examples/general/axis/design.zh.md
View file
@@ -0,0 +1,5 @@
---
title: 设计规范
---

设计规范
6 changes: 6 additions & 0 deletions examples/general/axis/index.en.md
View file
@@ -0,0 +1,6 @@
---
title: Axis
order: 1
---

Description about this component.
4 changes: 4 additions & 0 deletions examples/general/axis/index.zh.md
View file
@@ -0,0 +1,4 @@
---
title: 坐标轴
order: 1
---

0 comments on commit bbea503

Please sign in to comment.