add SearchMonitor userStat
This commit is contained in:
parent
63a57d2315
commit
88ed67a991
|
@ -0,0 +1,99 @@
|
||||||
|
import React, { PureComponent } from 'react';
|
||||||
|
|
||||||
|
import {
|
||||||
|
G2,
|
||||||
|
Chart,
|
||||||
|
Geom,
|
||||||
|
Axis,
|
||||||
|
Tooltip,
|
||||||
|
Coord,
|
||||||
|
Label,
|
||||||
|
Legend,
|
||||||
|
View,
|
||||||
|
Guide,
|
||||||
|
Shape,
|
||||||
|
Facet,
|
||||||
|
Util
|
||||||
|
} from 'bizcharts';
|
||||||
|
import DataSet from '@antv/data-set';
|
||||||
|
|
||||||
|
class UserStat extends PureComponent {
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const data = [
|
||||||
|
{
|
||||||
|
name: "王飞",
|
||||||
|
count: 2000
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "张晓萌",
|
||||||
|
count: 1870
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "李静",
|
||||||
|
count: 1468
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "黄靖宇",
|
||||||
|
count: 1236
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "扬一鸣",
|
||||||
|
count: 1098
|
||||||
|
}
|
||||||
|
,
|
||||||
|
{
|
||||||
|
name: "管涛",
|
||||||
|
count: 901
|
||||||
|
}
|
||||||
|
,
|
||||||
|
{
|
||||||
|
name: "匡伯欣",
|
||||||
|
count: 810
|
||||||
|
}
|
||||||
|
,
|
||||||
|
{
|
||||||
|
name: "阳坚文",
|
||||||
|
count: 780
|
||||||
|
}
|
||||||
|
,
|
||||||
|
{
|
||||||
|
name: "覃文唯",
|
||||||
|
count: 502
|
||||||
|
}
|
||||||
|
,
|
||||||
|
{
|
||||||
|
name: "吕贤",
|
||||||
|
count: 306
|
||||||
|
}
|
||||||
|
];
|
||||||
|
const ds = new DataSet();
|
||||||
|
const dv = ds.createView().source(data);
|
||||||
|
dv.source(data).transform({
|
||||||
|
type: "sort",
|
||||||
|
|
||||||
|
callback(a, b) {
|
||||||
|
// 排序依据,和原生js的排序callback一致
|
||||||
|
return a.count - b.count > 0;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<Chart height={400} data={dv} forceFit>
|
||||||
|
<Coord transpose />
|
||||||
|
<Axis
|
||||||
|
name="name"
|
||||||
|
label={{
|
||||||
|
offset: 12
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<Axis name="count" />
|
||||||
|
<Tooltip />
|
||||||
|
<Geom type="interval" position="name*count" />
|
||||||
|
</Chart>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default UserStat;
|
|
@ -31,6 +31,7 @@ import {
|
||||||
} from 'bizcharts';
|
} from 'bizcharts';
|
||||||
import DataSet from '@antv/data-set';
|
import DataSet from '@antv/data-set';
|
||||||
import Slider from 'bizcharts-plugin-slider';
|
import Slider from 'bizcharts-plugin-slider';
|
||||||
|
import UserStat from './Search/UserStat';
|
||||||
import TagCloud from './Search/TagCloud';
|
import TagCloud from './Search/TagCloud';
|
||||||
|
|
||||||
import styles from "./Monitor.less";
|
import styles from "./Monitor.less";
|
||||||
|
@ -43,17 +44,17 @@ class SearchMonitor extends PureComponent {
|
||||||
return (
|
return (
|
||||||
<GridContent>
|
<GridContent>
|
||||||
<Row gutter={24}>
|
<Row gutter={24}>
|
||||||
{/*<Col xl={6} lg={12} sm={24} xs={24}>*/}
|
<Col xl={8} lg={12} md={24} sm={24} xs={24}>
|
||||||
{/* <Card*/}
|
<Card
|
||||||
{/* title="待定"*/}
|
title="用户统计"
|
||||||
{/* loading={false}*/}
|
loading={false}
|
||||||
{/* bordered={false}*/}
|
bordered={false}
|
||||||
{/* bodyStyle={{ overflow: 'hidden' }}*/}
|
bodyStyle={{ overflow: 'hidden' }}
|
||||||
{/* >*/}
|
>
|
||||||
{/* <h1>待定</h1>*/}
|
<UserStat></UserStat>
|
||||||
{/* </Card>*/}
|
</Card>
|
||||||
{/*</Col>*/}
|
</Col>
|
||||||
<Col xl={6} lg={12} sm={24} xs={24}>
|
<Col xl={8} lg={12} md={24} sm={24} xs={24}>
|
||||||
<Card
|
<Card
|
||||||
title="热门搜索"
|
title="热门搜索"
|
||||||
loading={false}
|
loading={false}
|
||||||
|
@ -62,6 +63,18 @@ class SearchMonitor extends PureComponent {
|
||||||
>
|
>
|
||||||
<TagCloud>
|
<TagCloud>
|
||||||
|
|
||||||
|
</TagCloud>
|
||||||
|
</Card>
|
||||||
|
</Col>
|
||||||
|
<Col xl={8} lg={12} md={24} sm={24} xs={24}>
|
||||||
|
<Card
|
||||||
|
title="新词"
|
||||||
|
loading={false}
|
||||||
|
bordered={false}
|
||||||
|
bodyStyle={{ overflow: 'hidden' }}
|
||||||
|
>
|
||||||
|
<TagCloud>
|
||||||
|
|
||||||
</TagCloud>
|
</TagCloud>
|
||||||
</Card>
|
</Card>
|
||||||
</Col>
|
</Col>
|
||||||
|
|
Loading…
Reference in New Issue