fix: 修复 slider demos, 新增 scrollbar (#1594)

* fix: 修复 slider demos, 新增 scrollbar

* fix: 文档注释 changeData, 修复词云图 data 为空的错误

Co-authored-by: liufu.lf <[email protected]>

Author: lxfu1

docs/common/chart-methods.en.md

@@ -23,6 +23,7 @@ plot.update({
 });
 ```
 
+<!--
 #### changeData()
 
 <description>**可选** </description>
@@ -35,4 +36,4 @@ plot.update({
 
 ```ts
 plot.changeData(newData);
-```
+``` -->

docs/common/chart-methods.zh.md

@@ -23,7 +23,7 @@ plot.update({
 });
 ```
 
-#### changeData()
+<!-- #### changeData()
 
 <description>**可选** </description>
 
@@ -35,4 +35,4 @@ plot.update({
 
 ```ts
 plot.changeData(newData);
-```
+``` -->

docs/manual/upgrade.zh.md

@@ -40,14 +40,14 @@ G2Plot 2.0 兼容大部分的 1.x 版本图表功能和配置项，详情如下
 interactions: [
   {
     type: 'slider',
-    min: 0.1,
-    max: 0.8
+    start: 0.1,
+    end: 0.8
   },
 ],
 // 变更后
 slider: {
-  min: 0.1,
-  max: 0.8
+  start: 0.1,
+  end: 0.8
 },
 ```
 

examples/area/basic/demo/basic-slider.ts

@@ -12,8 +12,8 @@ fetch('https://gw.alipayobjects.com/os/bmw-prod/1d565782-dde4-4bb6-8946-ea6a38cc
         tickCount: 5,
       },
       slider: {
-        min: 0.1,
-        max: 0.9,
+        start: 0.1,
+        end: 0.9,
         trendCfg: {
           isArea: true,
         },

examples/area/stacked/demo/basic-slider.ts

@@ -9,8 +9,8 @@ fetch('https://gw.alipayobjects.com/os/bmw-prod/b21e7336-0b3e-486c-9070-612ede49
       yField: 'value',
       seriesField: 'country',
       slider: {
-        min: 0.1,
-        max: 0.9,
+        start: 0.1,
+        end: 0.9,
       },
     });
     area.render();

examples/line/basic/demo/line-slider.ts

@@ -13,8 +13,8 @@ fetch('https://gw.alipayobjects.com/os/bmw-prod/1d565782-dde4-4bb6-8946-ea6a38cc
         tickCount: 5,
       },
       slider: {
-        min: 0.1,
-        max: 0.5,
+        start: 0.1,
+        end: 0.5,
       },
     });
 

examples/tiny-line/basic/demo/line-style.ts

@@ -9,7 +9,6 @@ const tinyLine = new TinyLine('container', {
   lineStyle: {
     lineDash: [2, 2],
   },
-  point: {},
 });
 
 tinyLine.render();

src/adaptor/common.ts

@@ -119,6 +119,19 @@ export function slider(params: Params<Options>): Params<Options> {
   return params;
 }
 
+/**
+ * 处理缩略轴的 adaptor
+ * @param params
+ */
+export function scrollbar(params: Params<Options>): Params<Options> {
+  const { chart, options } = params;
+  const { scrollbar } = options;
+
+  chart.option('scrollbar', scrollbar);
+
+  return params;
+}
+
 /**
  * scale 的 adaptor
  * @param axes

src/plots/column/adaptor.ts

@@ -1,7 +1,7 @@
 import { deepMix } from '@antv/util';
 import { Params } from '../../core/adaptor';
 import { findGeometry } from '../../utils';
-import { tooltip, slider, interaction, animation, theme, scale, annotation } from '../../adaptor/common';
+import { tooltip, slider, interaction, animation, theme, scale, annotation, scrollbar } from '../../adaptor/common';
 import { interval } from '../../adaptor/geometries';
 import { flow } from '../../utils';
 import { ColumnOptions } from './types';
@@ -128,6 +128,7 @@ export function adaptor(params: Params<ColumnOptions>) {
     legend,
     tooltip,
     slider,
+    scrollbar,
     theme,
     label,
     interaction,

src/plots/word-cloud/utils.ts

@@ -12,6 +12,9 @@ import { WordCloudOptions } from './types';
 export function transform(params: Params<WordCloudOptions>) {
   const { chart, options } = params;
   const { data, imageMask, wordField, weightField, wordStyle, timeInterval, spiral } = options;
+  if (!data || !data.length) {
+    return [];
+  }
   const { fontFamily, fontWeight, padding } = wordStyle;
   const dv = new DataSet.View().source(data);
   const range = dv.range(weightField);

src/types/common.ts

@@ -8,6 +8,7 @@ import { Animation } from './animation';
 import { Annotation } from './annotation';
 import { State } from './state';
 import { Slider } from './slider';
+import { Scrollbar } from './scrollbar';
 import { ColorAttr } from './attr';
 
 /** annotation position */
@@ -116,6 +117,8 @@ export type Options = {
   readonly legend?: Legend;
   /** 缩略轴 slider 的配置项 */
   readonly slider?: Slider;
+  /** 缩略轴 scrollbar 的配置项 */
+  readonly scrollbar?: Scrollbar;
   readonly animation?: Animation;
   readonly interactions?: Interaction[];
   readonly annotations?: Annotation[];

src/types/scrollbar.ts

@@ -0,0 +1 @@
+export { ScrollbarOption as Scrollbar } from '@antv/g2/lib/interface';

src/types/slider.ts

@@ -1,3 +1 @@
-// 等 PR https://github.com/antvis/G2/pull/2766 合并，发包之后即可使用 G2 导出的
-// export { SliderOption as Slider } from '@antv/g2/lib/interface';
-export type Slider = any;
+export { SliderOption as Slider } from '@antv/g2/lib/interface';