Merge 1170549 into 8815632

.eslintrc.js

@@ -24,6 +24,7 @@ module.exports = {
     'no-console': 'off',
     'arrow-body-style': 'off',
     'no-useless-constructor': 'off',
+    'no-nested-ternary': 'off',
   },
   settings: {
     'import/parsers': {

__tests__/unit/scales/band.spec.ts

@@ -11,6 +11,7 @@ describe('band scale', () => {
     expect(opt.paddingOuter).toStrictEqual(0);
     expect(opt.align).toStrictEqual(0.5);
     expect(opt.range).toStrictEqual([0, 1]);
+    expect(opt.flex).toStrictEqual([]);
 
     expect(bandScale.getBandWidth()).toStrictEqual(1);
     expect(bandScale.getStep()).toStrictEqual(1);
@@ -159,4 +160,43 @@ describe('band scale', () => {
 
     expect(bandScale.getOptions().range).toStrictEqual([0, 1000]);
   });
+
+  test('test flex options', () => {
+    const bandScale = new Band({
+      domain: ['A', 'B', 'C'],
+      flex: [2, 3, 1],
+      range: [0, 500],
+    });
+
+    const ba = bandScale.getBandWidth('A');
+    const bb = bandScale.getBandWidth('B');
+    const bc = bandScale.getBandWidth('C');
+    expect([ba, bb, bc].map((d) => d / bc)).toEqual([2, 3, 1]);
+
+    expect(bandScale.getStep('A')).toBeCloseTo(166.67);
+    expect(bandScale.getStep('B')).toBe(250);
+    expect(bandScale.getStep('C')).toBeCloseTo(83.33);
+
+    expect(bandScale.map('A')).toBe(0);
+    expect(bandScale.map('B')).toBeCloseTo(166.67);
+    expect(bandScale.map('C')).toBeCloseTo(416.67);
+  });
+
+  test('test patch flex options', () => {
+    const bandScale = new Band({
+      domain: ['A', 'B', 'C'],
+      flex: [2, 3],
+      range: [0, 500],
+    });
+    expect(bandScale.map('A')).toBe(0);
+    expect(bandScale.map('B')).toBeCloseTo(166.67);
+    expect(bandScale.map('C')).toBeCloseTo(416.67);
+
+    bandScale.update({
+      flex: [2, 3, 1, 1],
+    });
+    expect(bandScale.map('A')).toBe(0);
+    expect(bandScale.map('B')).toBeCloseTo(166.67);
+    expect(bandScale.map('C')).toBeCloseTo(416.67);
+  });
 });

docs/api/scales/band.md

@@ -8,6 +8,7 @@ The figure in the [options](#options) will give you a better understanding of th
 
 ## Usage
 
+Band with uniform bandWidth.
 ```ts
 import { Band, BandOptions } from '@antv/scale';
 
@@ -25,6 +26,24 @@ x.invert(75); // 'four'
 x.getBandWidth();  // 25
 ```
 
+Band with flex bandWidth.
+```ts
+import { Band, BandOptions } from '@antv/scale';
+
+const options: BandOptions = {
+  domain: ['A', 'B', 'C'],
+  flex: [2, 3, 1],
+  range: [0, 500],
+};
+
+const x = new Band(options);
+
+const ba = bandScale.getBandWidth('A');
+const bb = bandScale.getBandWidth('B');
+const bc = bandScale.getBandWidth('C');
+[ba, bb, bc].map((d) => d / bc)) // [2, 3, 1];
+```
+
 ## Options
 
 | Key | Description | Type | Default|  
@@ -38,6 +57,7 @@ x.getBandWidth();  // 25
 | padding | An easy way to set the paddingInner and paddingOuter for the scale. Notice: It's priority is higher than `paddingInner` and `paddingOuter` | `number` | `0` |
 | align | The `align` option specifies how outer padding is distributed in the range, the value should in the range [0, 1]. For example, value of 0.5 means that bands should be centered within the range, value of 0 or 1 may be used to shift the bands to one side. | `number` | `0.5` |
 | compare | Sets the comparator for sorting the domain before mapping. | ```(a: string or number, b: string or number) => number```| `undefined` |
+| flex | Sets the flex of the bandWidth for bands. | `number[]` | `[]`|
 
 <a name="band_map" href="#example">**Example**</a>
 
@@ -80,11 +100,11 @@ Returns the scale's current options.
 
 Returns a new band scale with the independent and same options as the original one.
 
-<a name="band_step" href="#band_clone">#</a> **getStep**<i>(): number</i>
+<a name="band_step" href="#band_clone">#</a> **getStep**<i>(x?: number | string): number</i>
 
 Returns band scale's step, for more info about `step`, please see [example](#example).
 
-<a name="band_get_band_width" href="#band_get_band_width">#</a> **getBandWidth**<i>(): number</i>
+<a name="band_get_band_width" href="#band_get_band_width">#</a> **getBandWidth**<i>(x?: number | string): number</i>
 
 Returns band scale's bandWidth, for more info about this, please see [example](#example).
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/scale",
-  "version": "0.4.6",
+  "version": "0.4.7",
   "description": "Toolkit for mapping abstract data into visual representation.",
   "license": "MIT",
   "main": "lib/index.js",
@@ -37,12 +37,10 @@
     "@commitlint/cli": "^11.0.0",
     "@commitlint/config-conventional": "^12.0.1",
     "@rollup/plugin-commonjs": "^19.0.0",
-    "@types/benchmark": "^2.1.0",
     "@types/color-string": "^1.5.0",
     "@types/jest": "^26.0.20",
     "@typescript-eslint/eslint-plugin": "^4.18.0",
     "@typescript-eslint/parser": "^4.19.0",
-    "benchmark": "^2.1.4",
     "d3-scale": "^3.2.4",
     "eslint": "^7.22.0",
     "eslint-config-airbnb": "^18.2.1",