inleft
2022-03-01 88f419df77ade235ea5e5e24be204842a24b7b33
commit | author | age
9bcb19 1 <template>
I 2   <div class="antv-chart-mini">
3     <div class="chart-wrapper" :style="{ height: 46 }">
4       <v-chart :force-fit="true" :height="height" :data="data" :padding="[36, 0, 18, 0]">
5         <v-tooltip />
6         <v-smooth-area position="x*y" />
7       </v-chart>
8     </div>
9   </div>
10 </template>
11
12 <script>
13 import moment from 'moment'
14 const data = []
15 const beginDay = new Date().getTime()
16
17 for (let i = 0; i < 10; i++) {
18   data.push({
19     x: moment(new Date(beginDay + 1000 * 60 * 60 * 24 * i)).format('YYYY-MM-DD'),
20     y: Math.round(Math.random() * 10)
21   })
22 }
23
24 const tooltip = [
25   'x*y',
26   (x, y) => ({
27     name: x,
28     value: y
29   })
30 ]
31 const scale = [{
32   dataKey: 'x',
33   min: 2
34 }, {
35   dataKey: 'y',
36   title: '时间',
37   min: 1,
38   max: 22
39 }]
40
41 export default {
42   name: 'MiniArea',
43   data () {
44     return {
45       data,
46       tooltip,
47       scale,
48       height: 100
49     }
50   }
51 }
52 </script>
53
54 <style lang="less" scoped>
55   @import "chart";
56 </style>