Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
A
ant-design-pro
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Registry
Registry
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Thiago Borges
ant-design-pro
Commits
df6ecfb4
Commit
df6ecfb4
authored
Oct 31, 2017
by
nikogu
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
update charts demo
parent
a8f3a075
Changes
9
Hide whitespace changes
Inline
Side-by-side
Showing
9 changed files
with
20 additions
and
16 deletions
+20
-16
simple.md
src/components/AvatarList/demo/simple.md
+4
-4
index.less
src/components/AvatarList/index.less
+5
-1
index.md
src/components/AvatarList/index.md
+2
-2
index.less
src/components/Charts/ChartCard/index.less
+2
-1
index.js
src/components/Charts/MiniProgress/index.js
+1
-1
chart-card.md
src/components/Charts/demo/chart-card.md
+1
-1
mini-progress.md
src/components/Charts/demo/mini-progress.md
+1
-1
mix.md
src/components/Charts/demo/mix.md
+3
-4
tag-cloud.md
src/components/Charts/demo/tag-cloud.md
+1
-1
No files found.
src/components/AvatarList/demo/simple.md
View file @
df6ecfb4
...
@@ -9,10 +9,10 @@ title: 基础样例
...
@@ -9,10 +9,10 @@ title: 基础样例
import AvatarList from 'ant-design-pro/lib/AvatarList';
import AvatarList from 'ant-design-pro/lib/AvatarList';
ReactDOM.render(
ReactDOM.render(
<AvatarList size="
small
">
<AvatarList size="
mini
">
<AvatarList.Item tips="Jake" src="https://gw.alipayobjects.com/zos/rmsportal/
ZiESqWwCXBRQoaPONSJe
.png" />
<AvatarList.Item tips="Jake" src="https://gw.alipayobjects.com/zos/rmsportal/
zOsKZmFRdUtvpqCImOVY
.png" />
<AvatarList.Item tips="Andy" src="https://gw.alipayobjects.com/zos/rmsportal/
tBOxZPlITHqwlGjsJWaF
.png" />
<AvatarList.Item tips="Andy" src="https://gw.alipayobjects.com/zos/rmsportal/
sfjbOqnsXXJgNCjCzDBL
.png" />
<AvatarList.Item tips="Niko" src="https://gw.alipayobjects.com/zos/rmsportal/
sBxjgqiuHMGRkIjqlQCd
.png" />
<AvatarList.Item tips="Niko" src="https://gw.alipayobjects.com/zos/rmsportal/
kZzEzemZyKLKFsojXItE
.png" />
</AvatarList>
</AvatarList>
, mountNode);
, mountNode);
```
`
```
`
src/components/AvatarList/index.less
View file @
df6ecfb4
...
@@ -10,12 +10,16 @@
...
@@ -10,12 +10,16 @@
}
}
.avatarItem {
.avatarItem {
border: 1px solid #fff;
display: inline-block;
display: inline-block;
font-size: @font-size-base;
font-size: @font-size-base;
margin-left: -8px;
margin-left: -8px;
width: @avatar-size-base;
width: @avatar-size-base;
height: @avatar-size-base;
height: @avatar-size-base;
:global {
.ant-avatar {
border: 1px solid #fff;
}
}
}
}
.avatarItemLarge {
.avatarItemLarge {
...
...
src/components/AvatarList/index.md
View file @
df6ecfb4
...
@@ -5,7 +5,7 @@ order: 1
...
@@ -5,7 +5,7 @@ order: 1
cols
:
1
cols
:
1
---
---
一组用户头像,常用在项目/团队成员列表。
一组用户头像,常用在项目/团队成员列表。
可通过设置
`size`
属性来指定头像大小。
## API
## API
...
@@ -13,7 +13,7 @@ cols: 1
...
@@ -13,7 +13,7 @@ cols: 1
| 参数 | 说明 | 类型 | 默认值 |
| 参数 | 说明 | 类型 | 默认值 |
|----------|------------------------------------------|-------------|-------|
|----------|------------------------------------------|-------------|-------|
| size | 头像大小 |
`large`
、
`small`
| -
|
| size | 头像大小 |
`large`
、
`small`
、
`mini`
,
`default`
|
`default`
|
### AvatarList.Item
### AvatarList.Item
...
...
src/components/Charts/ChartCard/index.less
View file @
df6ecfb4
...
@@ -25,6 +25,7 @@
...
@@ -25,6 +25,7 @@
height: 38px;
height: 38px;
}
}
.content {
.content {
margin-bottom: 12px;
position: relative;
position: relative;
width: 100%;
width: 100%;
}
}
...
@@ -37,7 +38,7 @@
...
@@ -37,7 +38,7 @@
.footer {
.footer {
border-top: 1px solid @border-color-split;
border-top: 1px solid @border-color-split;
padding-top: 9px;
padding-top: 9px;
margin-top:
20
px;
margin-top:
8
px;
& > * {
& > * {
position: relative;
position: relative;
}
}
...
...
src/components/Charts/MiniProgress/index.js
View file @
df6ecfb4
...
@@ -3,7 +3,7 @@ import { Tooltip } from 'antd';
...
@@ -3,7 +3,7 @@ import { Tooltip } from 'antd';
import
styles
from
'./index.less'
;
import
styles
from
'./index.less'
;
const
MiniProgress
=
({
target
,
color
,
strokeWidth
,
percent
})
=>
(
const
MiniProgress
=
({
target
,
color
=
'rgb(19, 194, 194)'
,
strokeWidth
,
percent
})
=>
(
<
div
className
=
{
styles
.
miniProgress
}
>
<
div
className
=
{
styles
.
miniProgress
}
>
<
Tooltip
title
=
{
`目标值:
${
target
}
%`
}
>
<
Tooltip
title
=
{
`目标值:
${
target
}
%`
}
>
<
div
<
div
...
...
src/components/Charts/demo/chart-card.md
View file @
df6ecfb4
...
@@ -14,7 +14,7 @@ import numeral from 'numeral';
...
@@ -14,7 +14,7 @@ import numeral from 'numeral';
ReactDOM.render(
ReactDOM.render(
<ChartCard
<ChartCard
title="销售额"
title="销售额"
action={<Tooltip title="
我是一段说明"><Icon type="exclamation
-circle-o" /></Tooltip>}
action={<Tooltip title="
指标说明"><Icon type="info
-circle-o" /></Tooltip>}
total={yuan(126560)}
total={yuan(126560)}
footer={<Field label="日均销售额" value={numeral(12423).format('0,0')} />}
footer={<Field label="日均销售额" value={numeral(12423).format('0,0')} />}
contentHeight={46}
contentHeight={46}
...
...
src/components/Charts/demo/mini-progress.md
View file @
df6ecfb4
...
@@ -7,6 +7,6 @@ title: 迷你进度条
...
@@ -7,6 +7,6 @@ title: 迷你进度条
import { MiniProgress } from 'ant-design-pro/lib/Charts';
import { MiniProgress } from 'ant-design-pro/lib/Charts';
ReactDOM.render(
ReactDOM.render(
<MiniProgress percent={78} strokeWidth={8} target={80}
color="#5DD1DD"
/>
<MiniProgress percent={78} strokeWidth={8} target={80} />
, mountNode);
, mountNode);
````
````
src/components/Charts/demo/mix.md
View file @
df6ecfb4
...
@@ -37,7 +37,6 @@ ReactDOM.render(
...
@@ -37,7 +37,6 @@ ReactDOM.render(
/>
/>
<MiniArea
<MiniArea
line
line
color="#cceafe"
height={45}
height={45}
data={visitData}
data={visitData}
/>
/>
...
@@ -46,7 +45,7 @@ ReactDOM.render(
...
@@ -46,7 +45,7 @@ ReactDOM.render(
<Col span={24} style={{ marginTop: 24 }}>
<Col span={24} style={{ marginTop: 24 }}>
<ChartCard
<ChartCard
title="访问量"
title="访问量"
action={<Tooltip title="
访问量是关键指标"><Icon type="exclamation
-circle-o" /></Tooltip>}
action={<Tooltip title="
指标说明"><Icon type="info
-circle-o" /></Tooltip>}
total={numeral(8846).format('0,0')}
total={numeral(8846).format('0,0')}
footer={<Field label="日访问量" value={numeral(1234).format('0,0')} />}
footer={<Field label="日访问量" value={numeral(1234).format('0,0')} />}
contentHeight={46}
contentHeight={46}
...
@@ -60,7 +59,7 @@ ReactDOM.render(
...
@@ -60,7 +59,7 @@ ReactDOM.render(
<Col span={24} style={{ marginTop: 24 }}>
<Col span={24} style={{ marginTop: 24 }}>
<ChartCard
<ChartCard
title="线上购物转化率"
title="线上购物转化率"
action={<Tooltip title="
购买效率"><Icon type="exclamation
-circle-o" /></Tooltip>}
action={<Tooltip title="
指标说明"><Icon type="info
-circle-o" /></Tooltip>}
total="78%"
total="78%"
footer={
footer={
<div>
<div>
...
@@ -76,7 +75,7 @@ ReactDOM.render(
...
@@ -76,7 +75,7 @@ ReactDOM.render(
}
}
contentHeight={46}
contentHeight={46}
>
>
<MiniProgress percent={78} strokeWidth={8} target={80}
color="#5DD1DD"
/>
<MiniProgress percent={78} strokeWidth={8} target={80} />
</ChartCard>
</ChartCard>
</Col>
</Col>
</Row>
</Row>
...
...
src/components/Charts/demo/tag-cloud.md
View file @
df6ecfb4
...
@@ -11,7 +11,7 @@ import { TagCloud } from 'ant-design-pro/lib/Charts';
...
@@ -11,7 +11,7 @@ import { TagCloud } from 'ant-design-pro/lib/Charts';
const tags = [];
const tags = [];
for (let i = 0; i < 50; i += 1) {
for (let i = 0; i < 50; i += 1) {
tags.push({
tags.push({
name: `
test
-${i}`,
name: `
TagClout-Title
-${i}`,
value: Math.floor((Math.random() * 50)) + 20,
value: Math.floor((Math.random() * 50)) + 20,
});
});
}
}
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment