Procházet zdrojové kódy

change the default tickCount of Radar (#2896)

* change the default tickCount of Radar

solve the problem mentioned in issue #2881

* 词云修复鼠标移过时变色的偏移并支持Tooltip显示数量
Immortalt před 7 roky
rodič
revize
3ac37ebe89

+ 1 - 1
src/components/Charts/Radar/index.js

@@ -92,7 +92,7 @@ class Radar extends Component {
       title,
       hasLegend = false,
       forceFit = true,
-      tickCount = 4,
+      tickCount = 5,
       padding = [35, 30, 16, 30],
       animate = true,
       colors = defaultColors,

+ 18 - 6
src/components/Charts/TagCloud/index.js

@@ -1,5 +1,5 @@
 import React, { Component } from 'react';
-import { Chart, Geom, Coord, Shape } from 'bizcharts';
+import { Chart, Geom, Coord, Shape, Tooltip } from 'bizcharts';
 import DataSet from '@antv/data-set';
 import Debounce from 'lodash-decorators/debounce';
 import Bind from 'lodash-decorators/bind';
@@ -91,8 +91,8 @@ class TagCloud extends Component {
       return;
     }
 
-    const h = height * 4;
-    const w = this.root.offsetWidth * 4;
+    const h = height;
+    const w = this.root.offsetWidth;
 
     const onload = () => {
       const dv = new DataSet.View().source(data);
@@ -104,14 +104,14 @@ class TagCloud extends Component {
         imageMask: this.imageMask,
         font: 'Verdana',
         size: [w, h], // 宽高设置最好根据 imageMask 做调整
-        padding: 5,
+        padding: 0,
         timeInterval: 5000, // max execute time
         rotate() {
           return 0;
         },
         fontSize(d) {
           // eslint-disable-next-line
-          return Math.pow((d.value - min) / (max - min), 2) * (70 - 20) + 20;
+          return Math.pow((d.value - min) / (max - min), 2) * (17.5 - 5) + 5;
         },
       });
 
@@ -158,8 +158,20 @@ class TagCloud extends Component {
               y: { nice: false },
             }}
           >
+            <Tooltip showTitle={false} />
             <Coord reflect="y" />
-            <Geom type="point" position="x*y" color="text" shape="cloud" />
+            <Geom
+              type="point"
+              position="x*y"
+              color="text"
+              shape="cloud"
+              tooltip={[
+                'text*value',
+                function trans(text, value) {
+                  return { name: text, value };
+                },
+              ]}
+            />
           </Chart>
         )}
       </div>

+ 0 - 1
src/components/Charts/TagCloud/index.less

@@ -1,7 +1,6 @@
 .tagCloud {
   overflow: hidden;
   canvas {
-    transform: scale(0.25);
     transform-origin: 0 0;
   }
 }