@antv/g2 - npm Package Compare versions

Comparing version 5.1.1 to 5.1.2

CHANGELOG.md

@@ -0,1 +1,21 @@
+## [5.1.2](https://github.com/antvis/g2/compare/5.1.1...5.1.2) (2023-09-13)
+
+
+### Bug Fixes
+
+* **dual:** set series of line to band scale ([#5528](https://github.com/antvis/g2/issues/5528)) ([1446b1a](https://github.com/antvis/g2/commit/1446b1a4f0798304b8257c741bb3d0f1d189df2c))
+* **pie:** interaction for composite mark ([#5524](https://github.com/antvis/g2/issues/5524)) ([ae3138c](https://github.com/antvis/g2/commit/ae3138c150a774703b9404b61d98b0b388e8f541))
+* remove console.log in runtime ([#5532](https://github.com/antvis/g2/issues/5532)) ([e9486dc](https://github.com/antvis/g2/commit/e9486dcda4de02f959493eac5a0db90b89ade29a))
+* **tooltip:** legendFilter and shared tooltip ([#5534](https://github.com/antvis/g2/issues/5534)) ([7fc3e75](https://github.com/antvis/g2/commit/7fc3e7521ec18bb5c9b20d8544a6e9f0a615a4ef))
+* **types:** composition node ([#5527](https://github.com/antvis/g2/issues/5527)) ([88fdb41](https://github.com/antvis/g2/commit/88fdb4148432f02c5cb8f9e30b09cfac6298fbad))
+
+
+### Features
+
+* add mark.liquid ([#5508](https://github.com/antvis/g2/issues/5508)) ([69540e3](https://github.com/antvis/g2/commit/69540e327fe97debba0b0194e9a9fe5dd738cbee))
+* **canvas:** set feat/supportsCSSTransform to true by default ([#5526](https://github.com/antvis/g2/issues/5526)) ([ab59152](https://github.com/antvis/g2/commit/ab591522b5538c351c09679c1451097a21766363))
+* **examples:** 新增子弹图案例 ([#5530](https://github.com/antvis/g2/issues/5530)) ([3ae84d4](https://github.com/antvis/g2/commit/3ae84d4715a6c6fcc7a0261834225cf981a929f4))
+
+
+
 ## [5.1.1](https://github.com/antvis/g2/compare/5.1.0...5.1.1) (2023-09-07)
@@ -2,0 +22,0 @@

esm/api/chart.d.ts

 import { G2Spec } from '../spec';
-import { API } from './extend';
+import { API, CompositionAPI } from './extend';
 import { library } from './library';
+import { MarkNode as Node } from './mark';
 import type { RuntimeOptions } from './runtime';
 export interface Chart extends API<G2Spec, typeof library> {
 }
+export interface CompositionNode extends CompositionAPI<typeof library> {
+}
+export interface MarkNode extends Node {
+}
 export declare const Chart: new (options?: RuntimeOptions) => API<G2Spec, {
@@ -158,2 +163,3 @@ readonly 'data.fetch': import("../runtime").DataComponent<import("../data").FetchOptions>;
     readonly 'mark.wordCloud': import("../runtime").CompositeMarkComponent<import("..").WordCloudOptions>;
+    readonly 'mark.liquid': import("../runtime").CompositeMarkComponent<import("..").LiquidOptions>;
     readonly 'data.arc': import("../runtime").DataComponent<import("../data").ArcOptions>;
@@ -160,0 +166,0 @@ readonly 'data.cluster': import("../runtime").DataComponent<import("../data").ClusterOptions>;

esm/api/extend.d.ts

@@ -7,3 +7,2 @@ import { G2Spec } from '../spec';
 import { CompositionNode } from './composition';
-type CompositionOf<Library> = Of<Library, (composite?: any) => CompositionNode<CompositionOf<Library> & MarkOf<Library, (composite?: any) => MarkNode>> & MarkOf<Library, (composite?: any) => MarkNode> & CompositionOf<Library>>;
 type BuiltinComposition = {
@@ -13,4 +12,6 @@ 'composition.mark': any;
 };
+export type CompositionOf<Library> = Of<Library, (composite?: any) => CompositionAPI<Library>>;
+export type CompositionAPI<Library> = CompositionNode<CompositionOf<Library> & MarkOf<Library, (composite?: any) => MarkNode>> & MarkOf<Library, (composite?: any) => MarkNode> & CompositionOf<Library>;
 export type API<Spec, Library> = Runtime<Spec> & MarkOf<Library, (composite?: any) => MarkNode> & CompositionOf<Library & BuiltinComposition>;
 export declare function extend<Spec extends G2Spec = G2Spec, Library extends G2Library = G2Library>(Runtime: new (options: RuntimeOptions) => Runtime<Spec>, library: Library): new (options?: RuntimeOptions) => API<Spec, Library>;
 export {};

esm/api/index.d.ts

@@ -1,6 +0,4 @@
-export { Chart, type ChartOptions } from './chart';
-export { MarkNode } from './mark';
-export { CompositionNode } from './composition';
+export { Chart, type ChartOptions, type MarkNode, type CompositionNode, } from './chart';
 export { register } from './library';
 export { Runtime } from './runtime';
 export { extend } from './extend';

esm/api/index.js

@@ -1,4 +0,2 @@
-export { Chart } from './chart';
-export { MarkNode } from './mark';
-export { CompositionNode } from './composition';
+export { Chart, } from './chart';
 export { register } from './library';
@@ -5,0 +3,0 @@ export { Runtime } from './runtime';

esm/api/library.d.ts

@@ -153,2 +153,3 @@ import { G2ComponentNamespaces, G2Component } from '../runtime';
     readonly 'mark.wordCloud': import("../runtime").CompositeMarkComponent<import("..").WordCloudOptions>;
+    readonly 'mark.liquid': import("../runtime").CompositeMarkComponent<import("..").LiquidOptions>;
     readonly 'data.arc': import("../runtime").DataComponent<import("../data").ArcOptions>;
@@ -155,0 +156,0 @@ readonly 'data.cluster': import("../runtime").DataComponent<import("../data").ClusterOptions>;

esm/api/runtime.js

@@ -56,2 +56,3 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
             this._createCanvas();
+        this._context.canvas.getConfig().supportsCSSTransform = true;
         this._bindAutoFit();
@@ -58,0 +59,0 @@ this._rendering = true;

esm/index.d.ts

 export { render, renderToMountedElement, MAIN_LAYER_CLASS_NAME, LABEL_LAYER_CLASS_NAME, ELEMENT_CLASS_NAME, VIEW_CLASS_NAME, PLOT_CLASS_NAME, COMPONENT_CLASS_NAME, LABEL_CLASS_NAME, AREA_CLASS_NAME, MASK_CLASS_NAME, } from './runtime';
 export { corelib, stdlib, litelib, graphlib, plotlib, geolib, threedlib, } from './lib';
 export * from './mark';
-export { Chart, MarkNode, CompositionNode, register, Runtime, extend, type ChartOptions, } from './api';
+export { Chart, type MarkNode, type CompositionNode, register, Runtime, extend, type ChartOptions, } from './api';
 export { ChartEvent } from './utils/event';
 export type { G2Context } from './runtime';
 export * from './spec';

esm/index.js

@@ -6,5 +6,5 @@ import { runtime } from '@antv/g';
 export * from './mark';
-export { Chart, MarkNode, CompositionNode, register, Runtime, extend, } from './api';
+export { Chart, register, Runtime, extend, } from './api';
 export { ChartEvent } from './utils/event';
 export * from './spec';
 //# sourceMappingURL=index.js.map

esm/interaction/tooltip.d.ts

@@ -10,3 +10,3 @@ import { DisplayObject } from '@antv/g';
 export declare function tooltip(root: DisplayObject, { elements: elementsof, scale, render, groupName, sort: sortFunction, filter: filterFunction, emitter, wait, leading, trailing, groupKey, // group elements by specified key
-single, position, enterable, datum, view, mount, bounding, body, disableNative, }: Record<string, any>): () => void;
+single, position, enterable, datum, view, mount, bounding, shared, body, disableNative, }: Record<string, any>): () => void;
 export declare function Tooltip(options: any): (target: any, viewInstances: any, emitter: any) => () => void;

esm/interaction/tooltip.js

@@ -16,3 +16,3 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { Tooltip as TooltipComponent } from '@antv/gui';
-import { Constant, Identity } from '@antv/scale';
+import { Constant, Band } from '@antv/scale';
 import { defined, subObject } from '../utils/helper';
@@ -133,3 +133,3 @@ import { isTranspose, isPolar } from '../utils/coordinate';
 function groupNameOf(scale, datum) {
-    const { color: scaleColor, series: scaleSeries } = scale;
+    const { color: scaleColor, series: scaleSeries, facet = false } = scale;
     const { color, series } = datum;
@@ -139,3 +139,3 @@ const invertAble = (scale) => {
             scale.invert &&
-            !(scale instanceof Identity) &&
+            !(scale instanceof Band) &&
             !(scale instanceof Constant));
@@ -146,4 +146,8 @@ };
         return scaleSeries.invert(series);
-    if (series && series !== color)
-        return series;
+    if (series &&
+        scaleSeries instanceof Band &&
+        scaleSeries.invert(series) !== color &&
+        !facet) {
+        return scaleSeries.invert(series);
+    }
     if (invertAble(scaleColor)) {
@@ -510,3 +514,3 @@ const name = scaleColor.invert(color);
 export function tooltip(root, { elements: elementsof, scale, render, groupName, sort: sortFunction, filter: filterFunction, emitter, wait = 50, leading = true, trailing = false, groupKey = (d) => d, // group elements by specified key
-single = true, position, enterable, datum, view, mount, bounding, body = true, disableNative = false, }) {
+single = true, position, enterable, datum, view, mount, bounding, shared = false, body = true, disableNative = false, }) {
     const elements = elementsof(root);
@@ -523,3 +527,3 @@ const elementSet = new Set(elements);
         const group = keyGroup.get(k);
-        const data = group.length === 1
+        const data = group.length === 1 && !shared
             ? singleItem(group[0])
@@ -643,2 +647,3 @@ : groupItems(group, scale, groupName);
             const startY = bbox.min[1];
+            Object.assign(scale, { facet: true });
             // @todo Nested structure rather than flat structure for facet?
@@ -656,5 +661,6 @@ // Add listener to the root area.
             emitter,
-            view }));
+            view,
+            shared }));
     };
 }
 //# sourceMappingURL=tooltip.js.map

esm/lib/plot.d.ts

@@ -6,2 +6,3 @@ export declare function plotlib(): {
     readonly 'mark.wordCloud': import("../runtime").CompositeMarkComponent<import("../mark").WordCloudOptions>;
+    readonly 'mark.liquid': import("../runtime").CompositeMarkComponent<import("../mark").LiquidOptions>;
 };

esm/lib/plot.js

@@ -1,2 +0,2 @@
-import { Boxplot, WordCloud, Gauge } from '../mark';
+import { Boxplot, WordCloud, Gauge, Liquid } from '../mark';
 import { Venn } from '../data';
@@ -9,4 +9,5 @@ export function plotlib() {
         'mark.wordCloud': WordCloud,
+        'mark.liquid': Liquid,
     };
 }
 //# sourceMappingURL=plot.js.map

esm/lib/std.d.ts

@@ -152,2 +152,3 @@ export declare function stdlib(): {
     readonly 'mark.wordCloud': import("../runtime").CompositeMarkComponent<import("..").WordCloudOptions>;
+    readonly 'mark.liquid': import("../runtime").CompositeMarkComponent<import("..").LiquidOptions>;
     readonly 'data.arc': import("../runtime").DataComponent<import("../data").ArcOptions>;
@@ -154,0 +155,0 @@ readonly 'data.cluster': import("../runtime").DataComponent<import("../data").ClusterOptions>;

esm/mark/area.js

@@ -71,3 +71,3 @@ import { group } from 'd3-array';
         { name: 'size' },
-        { name: 'series', scale: 'identity' },
+        { name: 'series', scale: 'band' },
     ],
@@ -74,0 +74,0 @@ preInference: [

esm/mark/gauge.d.ts

@@ -9,4 +9,4 @@ import { CompositeMarkComponent as CC } from '../runtime';
     thresholds?: number[];
-};
+} | number;
 export type GaugeOptions = Omit<GaugeMark, 'type'>;
 export declare const Gauge: CC<GaugeOptions>;

esm/mark/gauge.js

@@ -12,3 +12,3 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
-import { deepMix } from '@antv/util';
+import { deepMix, isNumber } from '@antv/util';
 import { Group } from '@antv/g';
@@ -111,4 +111,16 @@ import { filterPrefixObject, isUnset, subObject } from '../utils/helper';
 };
+function getGaugeData(data) {
+    if (isNumber(data)) {
+        // Percent range [0, 1].
+        const percent = Math.max(0, Math.min(data, 1));
+        return {
+            percent,
+            target: percent,
+            total: 1,
+        };
+    }
+    return data;
+}
 function dataTransform(data, scale) {
-    const { name = 'score', target, total, percent, thresholds = [] } = data;
+    const { name = 'score', target, total, percent, thresholds = [], } = getGaugeData(data);
     const _target = percent || target;
@@ -115,0 +127,0 @@ const _total = percent ? 1 : total;

esm/mark/index.d.ts

@@ -33,2 +33,3 @@ export { Interval } from './interval';
 export { Heatmap } from './heatmap';
+export { Liquid } from './liquid';
 export type { IntervalOptions } from './interval';
@@ -62,1 +63,2 @@ export type { RectOptions } from './rect';
 export type { HeatmapOptions } from './heatmap';
+export type { LiquidOptions } from './liquid';

esm/mark/index.js

@@ -33,2 +33,3 @@ export { Interval } from './interval';
 export { Heatmap } from './heatmap';
+export { Liquid } from './liquid';
 //# sourceMappingURL=index.js.map

esm/mark/line.js

@@ -81,3 +81,3 @@ import { group } from 'd3-array';
         { name: 'size' },
-        { name: 'series', scale: 'identity' },
+        { name: 'series', scale: 'band' },
     ],
@@ -84,0 +84,0 @@ preInference: [

esm/runtime/plot.js

@@ -300,2 +300,4 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
         options.coordinate = mergedOptions.coordinate;
+        // @ts-ignore
+        options.marks = [...mergedOptions.marks, ...mergedOptions.components];
         const transformedOptions = coordinate2Transform(mergedOptions, library);
@@ -302,0 +304,0 @@ const state = yield initializeMarks(transformedOptions, library);

esm/runtime/transform.js

@@ -21,3 +21,3 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
 };
-import { deepMix } from '@antv/util';
+import { deepMix, isNumber } from '@antv/util';
 import { format } from 'd3-format';
@@ -275,2 +275,5 @@ import { indexOf, mapObject } from '../utils/array';
 function normalizedDataSource(data) {
+    // Liquid、Gauge need number data.
+    if (isNumber(data))
+        return { type: 'inline', value: data };
     // Return null as a placeholder.
@@ -277,0 +280,0 @@ if (!data)

esm/shape/index.d.ts

@@ -63,2 +63,3 @@ export { Rect as IntervalShape } from './interval/rect';
 export { Shape as ShapeShape } from './shape/shape';
+export { Liquid as LiquidShape } from './liquid/liquid';
 export type { RectOptions as IntervalShapeOptions } from './interval/rect';
@@ -112,1 +113,2 @@ export type { HollowOptions as IntervalHollowOptions } from './interval/hollow';
 export type { ShapeOptions as ShapeShapeOptions } from './shape/shape';
+export type { LiquidOptions } from './liquid/liquid';

esm/shape/index.js

@@ -63,2 +63,3 @@ export { Rect as IntervalShape } from './interval/rect';
 export { Shape as ShapeShape } from './shape/shape';
+export { Liquid as LiquidShape } from './liquid/liquid';
 //# sourceMappingURL=index.js.map

esm/spec/mark.d.ts

@@ -13,3 +13,3 @@ import { MarkComponent } from '../runtime';
 export type Mark = IntervalMark | RectMark | LineMark | PointMark | TextMark | CellMark | AreaMark | NodeMark | EdgeMark | ImageMark | PolygonMark | BoxMark | VectorMark | LineXMark | LineYMark | RangeMark | RangeXMark | RangeYMark | ConnectorMark | SankeyMark | PathMark | TreemapMark | PackMark | BoxPlotMark | ShapeMark | ForceGraphMark | TreeMark | WordCloudMark | DensityMark | CustomMark | CompositeMark;
-export type MarkTypes = 'interval' | 'rect' | 'line' | 'point' | 'text' | 'cell' | 'area' | 'node' | 'edge' | 'link' | 'image' | 'polygon' | 'box' | 'vector' | 'lineX' | 'lineY' | 'connector' | 'range' | 'rangeX' | 'rangeY' | 'sankey' | 'path' | 'treemap' | 'pack' | 'boxplot' | 'shape' | 'forceGraph' | 'tree' | 'wordCloud' | 'gauge' | 'density' | 'heatmap' | MarkComponent | CompositeMarkType;
+export type MarkTypes = 'interval' | 'rect' | 'line' | 'point' | 'text' | 'cell' | 'area' | 'node' | 'edge' | 'link' | 'image' | 'polygon' | 'box' | 'vector' | 'lineX' | 'lineY' | 'connector' | 'range' | 'rangeX' | 'rangeY' | 'sankey' | 'path' | 'treemap' | 'pack' | 'boxplot' | 'shape' | 'forceGraph' | 'tree' | 'wordCloud' | 'gauge' | 'density' | 'heatmap' | 'liquid' | MarkComponent | CompositeMarkType;
 export type ChannelTypes = 'x' | 'y' | 'z' | 'x1' | 'y1' | 'series' | 'color' | 'opacity' | 'shape' | 'size' | 'key' | 'groupKey' | 'position' | 'series' | 'enterType' | 'enterEasing' | 'enterDuration' | 'enterDelay' | 'updateType' | 'updateEasing' | 'updateDuration' | 'updateDelay' | 'exitType' | 'exitEasing' | 'exitDuration' | 'exitDelay' | `position${number}`;
@@ -194,2 +194,3 @@ export type PositionChannelTypes = 'x' | 'y' | 'z' | 'position' | `position${number}`;
 export type HeatmapMark = BaseMark<'heatmap'>;
+export type LiquidMark = BaseMark<'liquid'>;
 export type CustomMark = BaseMark<MarkComponent, ChannelTypes>;

esm/utils/helper.js

@@ -39,4 +39,12 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     for (const [key, value] of Object.entries(attributes)) {
-        if (!exclude.has(key))
-            target.attr(key, value);
+        if (!exclude.has(key)) {
+            // @todo Fix in @antv/g
+            if (key === 'transform') {
+                target.attr(key, '');
+                target.attr(key, value);
+            }
+            else {
+                target.attr(key, value);
+            }
+        }
     }
@@ -43,0 +51,0 @@ }

lib/api/chart.d.ts

 import { G2Spec } from '../spec';
-import { API } from './extend';
+import { API, CompositionAPI } from './extend';
 import { library } from './library';
+import { MarkNode as Node } from './mark';
 import type { RuntimeOptions } from './runtime';
 export interface Chart extends API<G2Spec, typeof library> {
 }
+export interface CompositionNode extends CompositionAPI<typeof library> {
+}
+export interface MarkNode extends Node {
+}
 export declare const Chart: new (options?: RuntimeOptions) => API<G2Spec, {
@@ -158,2 +163,3 @@ readonly 'data.fetch': import("../runtime").DataComponent<import("../data").FetchOptions>;
     readonly 'mark.wordCloud': import("../runtime").CompositeMarkComponent<import("..").WordCloudOptions>;
+    readonly 'mark.liquid': import("../runtime").CompositeMarkComponent<import("..").LiquidOptions>;
     readonly 'data.arc': import("../runtime").DataComponent<import("../data").ArcOptions>;
@@ -160,0 +166,0 @@ readonly 'data.cluster': import("../runtime").DataComponent<import("../data").ClusterOptions>;

lib/api/extend.d.ts

@@ -7,3 +7,2 @@ import { G2Spec } from '../spec';
 import { CompositionNode } from './composition';
-type CompositionOf<Library> = Of<Library, (composite?: any) => CompositionNode<CompositionOf<Library> & MarkOf<Library, (composite?: any) => MarkNode>> & MarkOf<Library, (composite?: any) => MarkNode> & CompositionOf<Library>>;
 type BuiltinComposition = {
@@ -13,4 +12,6 @@ 'composition.mark': any;
 };
+export type CompositionOf<Library> = Of<Library, (composite?: any) => CompositionAPI<Library>>;
+export type CompositionAPI<Library> = CompositionNode<CompositionOf<Library> & MarkOf<Library, (composite?: any) => MarkNode>> & MarkOf<Library, (composite?: any) => MarkNode> & CompositionOf<Library>;
 export type API<Spec, Library> = Runtime<Spec> & MarkOf<Library, (composite?: any) => MarkNode> & CompositionOf<Library & BuiltinComposition>;
 export declare function extend<Spec extends G2Spec = G2Spec, Library extends G2Library = G2Library>(Runtime: new (options: RuntimeOptions) => Runtime<Spec>, library: Library): new (options?: RuntimeOptions) => API<Spec, Library>;
 export {};

lib/api/index.d.ts

@@ -1,6 +0,4 @@
-export { Chart, type ChartOptions } from './chart';
-export { MarkNode } from './mark';
-export { CompositionNode } from './composition';
+export { Chart, type ChartOptions, type MarkNode, type CompositionNode, } from './chart';
 export { register } from './library';
 export { Runtime } from './runtime';
 export { extend } from './extend';

lib/api/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.extend = exports.Runtime = exports.register = exports.CompositionNode = exports.MarkNode = exports.Chart = void 0;
+exports.extend = exports.Runtime = exports.register = exports.Chart = void 0;
 var chart_1 = require("./chart");
 Object.defineProperty(exports, "Chart", { enumerable: true, get: function () { return chart_1.Chart; } });
-var mark_1 = require("./mark");
-Object.defineProperty(exports, "MarkNode", { enumerable: true, get: function () { return mark_1.MarkNode; } });
-var composition_1 = require("./composition");
-Object.defineProperty(exports, "CompositionNode", { enumerable: true, get: function () { return composition_1.CompositionNode; } });
 var library_1 = require("./library");
@@ -11,0 +7,0 @@ Object.defineProperty(exports, "register", { enumerable: true, get: function () { return library_1.register; } });

lib/api/library.d.ts

@@ -153,2 +153,3 @@ import { G2ComponentNamespaces, G2Component } from '../runtime';
     readonly 'mark.wordCloud': import("../runtime").CompositeMarkComponent<import("..").WordCloudOptions>;
+    readonly 'mark.liquid': import("../runtime").CompositeMarkComponent<import("..").LiquidOptions>;
     readonly 'data.arc': import("../runtime").DataComponent<import("../data").ArcOptions>;
@@ -155,0 +156,0 @@ readonly 'data.cluster': import("../runtime").DataComponent<import("../data").ClusterOptions>;

lib/api/runtime.js

@@ -62,2 +62,3 @@ "use strict";
             this._createCanvas();
+        this._context.canvas.getConfig().supportsCSSTransform = true;
         this._bindAutoFit();
@@ -64,0 +65,0 @@ this._rendering = true;

lib/index.d.ts

 export { render, renderToMountedElement, MAIN_LAYER_CLASS_NAME, LABEL_LAYER_CLASS_NAME, ELEMENT_CLASS_NAME, VIEW_CLASS_NAME, PLOT_CLASS_NAME, COMPONENT_CLASS_NAME, LABEL_CLASS_NAME, AREA_CLASS_NAME, MASK_CLASS_NAME, } from './runtime';
 export { corelib, stdlib, litelib, graphlib, plotlib, geolib, threedlib, } from './lib';
 export * from './mark';
-export { Chart, MarkNode, CompositionNode, register, Runtime, extend, type ChartOptions, } from './api';
+export { Chart, type MarkNode, type CompositionNode, register, Runtime, extend, type ChartOptions, } from './api';
 export { ChartEvent } from './utils/event';
 export type { G2Context } from './runtime';
 export * from './spec';

lib/index.js

@@ -17,3 +17,3 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChartEvent = exports.extend = exports.Runtime = exports.register = exports.CompositionNode = exports.MarkNode = exports.Chart = exports.threedlib = exports.geolib = exports.plotlib = exports.graphlib = exports.litelib = exports.stdlib = exports.corelib = exports.MASK_CLASS_NAME = exports.AREA_CLASS_NAME = exports.LABEL_CLASS_NAME = exports.COMPONENT_CLASS_NAME = exports.PLOT_CLASS_NAME = exports.VIEW_CLASS_NAME = exports.ELEMENT_CLASS_NAME = exports.LABEL_LAYER_CLASS_NAME = exports.MAIN_LAYER_CLASS_NAME = exports.renderToMountedElement = exports.render = void 0;
+exports.ChartEvent = exports.extend = exports.Runtime = exports.register = exports.Chart = exports.threedlib = exports.geolib = exports.plotlib = exports.graphlib = exports.litelib = exports.stdlib = exports.corelib = exports.MASK_CLASS_NAME = exports.AREA_CLASS_NAME = exports.LABEL_CLASS_NAME = exports.COMPONENT_CLASS_NAME = exports.PLOT_CLASS_NAME = exports.VIEW_CLASS_NAME = exports.ELEMENT_CLASS_NAME = exports.LABEL_LAYER_CLASS_NAME = exports.MAIN_LAYER_CLASS_NAME = exports.renderToMountedElement = exports.render = void 0;
 const g_1 = require("@antv/g");
@@ -44,4 +44,2 @@ g_1.runtime.enableCSSParsing = false;
 Object.defineProperty(exports, "Chart", { enumerable: true, get: function () { return api_1.Chart; } });
-Object.defineProperty(exports, "MarkNode", { enumerable: true, get: function () { return api_1.MarkNode; } });
-Object.defineProperty(exports, "CompositionNode", { enumerable: true, get: function () { return api_1.CompositionNode; } });
 Object.defineProperty(exports, "register", { enumerable: true, get: function () { return api_1.register; } });
@@ -48,0 +46,0 @@ Object.defineProperty(exports, "Runtime", { enumerable: true, get: function () { return api_1.Runtime; } });

lib/interaction/tooltip.d.ts

@@ -10,3 +10,3 @@ import { DisplayObject } from '@antv/g';
 export declare function tooltip(root: DisplayObject, { elements: elementsof, scale, render, groupName, sort: sortFunction, filter: filterFunction, emitter, wait, leading, trailing, groupKey, // group elements by specified key
-single, position, enterable, datum, view, mount, bounding, body, disableNative, }: Record<string, any>): () => void;
+single, position, enterable, datum, view, mount, bounding, shared, body, disableNative, }: Record<string, any>): () => void;
 export declare function Tooltip(options: any): (target: any, viewInstances: any, emitter: any) => () => void;

lib/interaction/tooltip.js

@@ -135,3 +135,3 @@ "use strict";
 function groupNameOf(scale, datum) {
-    const { color: scaleColor, series: scaleSeries } = scale;
+    const { color: scaleColor, series: scaleSeries, facet = false } = scale;
     const { color, series } = datum;
@@ -141,3 +141,3 @@ const invertAble = (scale) => {
             scale.invert &&
-            !(scale instanceof scale_1.Identity) &&
+            !(scale instanceof scale_1.Band) &&
             !(scale instanceof scale_1.Constant));
@@ -148,4 +148,8 @@ };
         return scaleSeries.invert(series);
-    if (series && series !== color)
-        return series;
+    if (series &&
+        scaleSeries instanceof scale_1.Band &&
+        scaleSeries.invert(series) !== color &&
+        !facet) {
+        return scaleSeries.invert(series);
+    }
     if (invertAble(scaleColor)) {
@@ -513,3 +517,3 @@ const name = scaleColor.invert(color);
 function tooltip(root, { elements: elementsof, scale, render, groupName, sort: sortFunction, filter: filterFunction, emitter, wait = 50, leading = true, trailing = false, groupKey = (d) => d, // group elements by specified key
-single = true, position, enterable, datum, view, mount, bounding, body = true, disableNative = false, }) {
+single = true, position, enterable, datum, view, mount, bounding, shared = false, body = true, disableNative = false, }) {
     const elements = elementsof(root);
@@ -526,3 +530,3 @@ const elementSet = new Set(elements);
         const group = keyGroup.get(k);
-        const data = group.length === 1
+        const data = group.length === 1 && !shared
             ? singleItem(group[0])
@@ -647,2 +651,3 @@ : groupItems(group, scale, groupName);
             const startY = bbox.min[1];
+            Object.assign(scale, { facet: true });
             // @todo Nested structure rather than flat structure for facet?
@@ -660,3 +665,4 @@ // Add listener to the root area.
             emitter,
-            view }));
+            view,
+            shared }));
     };
@@ -663,0 +669,0 @@ }

lib/lib/plot.d.ts

@@ -6,2 +6,3 @@ export declare function plotlib(): {
     readonly 'mark.wordCloud': import("../runtime").CompositeMarkComponent<import("../mark").WordCloudOptions>;
+    readonly 'mark.liquid': import("../runtime").CompositeMarkComponent<import("../mark").LiquidOptions>;
 };

lib/lib/plot.js

@@ -12,2 +12,3 @@ "use strict";
         'mark.wordCloud': mark_1.WordCloud,
+        'mark.liquid': mark_1.Liquid,
     };
@@ -14,0 +15,0 @@ }

lib/lib/std.d.ts

@@ -152,2 +152,3 @@ export declare function stdlib(): {
     readonly 'mark.wordCloud': import("../runtime").CompositeMarkComponent<import("..").WordCloudOptions>;
+    readonly 'mark.liquid': import("../runtime").CompositeMarkComponent<import("..").LiquidOptions>;
     readonly 'data.arc': import("../runtime").DataComponent<import("../data").ArcOptions>;
@@ -154,0 +155,0 @@ readonly 'data.cluster': import("../runtime").DataComponent<import("../data").ClusterOptions>;

lib/mark/area.js

@@ -75,3 +75,3 @@ "use strict";
         { name: 'size' },
-        { name: 'series', scale: 'identity' },
+        { name: 'series', scale: 'band' },
     ],
@@ -78,0 +78,0 @@ preInference: [

lib/mark/gauge.d.ts

@@ -9,4 +9,4 @@ import { CompositeMarkComponent as CC } from '../runtime';
     thresholds?: number[];
-};
+} | number;
 export type GaugeOptions = Omit<GaugeMark, 'type'>;
 export declare const Gauge: CC<GaugeOptions>;

lib/mark/gauge.js

@@ -113,4 +113,16 @@ "use strict";
 };
+function getGaugeData(data) {
+    if ((0, util_1.isNumber)(data)) {
+        // Percent range [0, 1].
+        const percent = Math.max(0, Math.min(data, 1));
+        return {
+            percent,
+            target: percent,
+            total: 1,
+        };
+    }
+    return data;
+}
 function dataTransform(data, scale) {
-    const { name = 'score', target, total, percent, thresholds = [] } = data;
+    const { name = 'score', target, total, percent, thresholds = [], } = getGaugeData(data);
     const _target = percent || target;
@@ -117,0 +129,0 @@ const _total = percent ? 1 : total;

lib/mark/index.d.ts

@@ -33,2 +33,3 @@ export { Interval } from './interval';
 export { Heatmap } from './heatmap';
+export { Liquid } from './liquid';
 export type { IntervalOptions } from './interval';
@@ -62,1 +63,2 @@ export type { RectOptions } from './rect';
 export type { HeatmapOptions } from './heatmap';
+export type { LiquidOptions } from './liquid';

lib/mark/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Heatmap = exports.Density = exports.Gauge = exports.WordCloud = exports.Tree = exports.ForceGraph = exports.Shape = exports.Boxplot = exports.Pack = exports.Treemap = exports.Path = exports.Sankey = exports.RangeY = exports.RangeX = exports.Range = exports.Connector = exports.LineX = exports.LineY = exports.Vector = exports.Box = exports.Polygon = exports.Image = exports.Link = exports.Area = exports.Cell = exports.Text = exports.Point3D = exports.Point = exports.Line3D = exports.Line = exports.Rect = exports.Interval = void 0;
+exports.Liquid = exports.Heatmap = exports.Density = exports.Gauge = exports.WordCloud = exports.Tree = exports.ForceGraph = exports.Shape = exports.Boxplot = exports.Pack = exports.Treemap = exports.Path = exports.Sankey = exports.RangeY = exports.RangeX = exports.Range = exports.Connector = exports.LineX = exports.LineY = exports.Vector = exports.Box = exports.Polygon = exports.Image = exports.Link = exports.Area = exports.Cell = exports.Text = exports.Point3D = exports.Point = exports.Line3D = exports.Line = exports.Rect = exports.Interval = void 0;
 var interval_1 = require("./interval");
@@ -68,2 +68,4 @@ Object.defineProperty(exports, "Interval", { enumerable: true, get: function () { return interval_1.Interval; } });
 Object.defineProperty(exports, "Heatmap", { enumerable: true, get: function () { return heatmap_1.Heatmap; } });
+var liquid_1 = require("./liquid");
+Object.defineProperty(exports, "Liquid", { enumerable: true, get: function () { return liquid_1.Liquid; } });
 //# sourceMappingURL=index.js.map

lib/mark/line.js

@@ -85,3 +85,3 @@ "use strict";
         { name: 'size' },
-        { name: 'series', scale: 'identity' },
+        { name: 'series', scale: 'band' },
     ],
@@ -88,0 +88,0 @@ preInference: [

lib/runtime/plot.js

@@ -304,2 +304,4 @@ "use strict";
         options.coordinate = mergedOptions.coordinate;
+        // @ts-ignore
+        options.marks = [...mergedOptions.marks, ...mergedOptions.components];
         const transformedOptions = (0, coordinate_1.coordinate2Transform)(mergedOptions, library);
@@ -306,0 +308,0 @@ const state = yield initializeMarks(transformedOptions, library);

lib/runtime/transform.js

@@ -288,2 +288,5 @@ "use strict";
 function normalizedDataSource(data) {
+    // Liquid、Gauge need number data.
+    if ((0, util_1.isNumber)(data))
+        return { type: 'inline', value: data };
     // Return null as a placeholder.
@@ -290,0 +293,0 @@ if (!data)

lib/shape/index.d.ts

@@ -63,2 +63,3 @@ export { Rect as IntervalShape } from './interval/rect';
 export { Shape as ShapeShape } from './shape/shape';
+export { Liquid as LiquidShape } from './liquid/liquid';
 export type { RectOptions as IntervalShapeOptions } from './interval/rect';
@@ -112,1 +113,2 @@ export type { HollowOptions as IntervalHollowOptions } from './interval/hollow';
 export type { ShapeOptions as ShapeShapeOptions } from './shape/shape';
+export type { LiquidOptions } from './liquid/liquid';

lib/shape/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BoxShape = exports.PolygonRibbon = exports.PolygonShape = exports.ImageShape = exports.LinkArc = exports.LinkVHV = exports.LinkSmooth = exports.LinkShape = exports.AreaHV = exports.AreaVH = exports.AreaHVH = exports.AreaSmooth = exports.AreaShape = exports.TextBadge = exports.TextShape = exports.VectorShape = exports.Cube = exports.Sphere = exports.PointTriangleDown = exports.PointTriangle = exports.PointTick = exports.PointSquare = exports.PointShape = exports.PointPlus = exports.PointLine = exports.PointHyphen = exports.PointHexagon = exports.PointDiamond = exports.PointCross = exports.PointBowtie = exports.PointHollowTriangleDown = exports.PointHollowTriangle = exports.PointHollowSquare = exports.PointHollow = exports.PointHollowHexagon = exports.PointHollowDiamond = exports.PointHollowBowtie = exports.Line3DShape = exports.LineTrail = exports.LineHVH = exports.LineVH = exports.LineHV = exports.LineSmooth = exports.LineShape = exports.CellHollow = exports.CellShape = exports.IntervalPyramid = exports.IntervalFunnel = exports.IntervalHollow = exports.IntervalShape = void 0;
-exports.ShapeShape = exports.RectHollow = exports.RectShape = exports.RangeShape = exports.HeatmapShape = exports.DensityShape = exports.PathHollow = exports.PathShape = exports.LabelShape = exports.ConnectorShape = exports.LineXY = exports.BoxViolin = void 0;
+exports.LiquidShape = exports.ShapeShape = exports.RectHollow = exports.RectShape = exports.RangeShape = exports.HeatmapShape = exports.DensityShape = exports.PathHollow = exports.PathShape = exports.LabelShape = exports.ConnectorShape = exports.LineXY = exports.BoxViolin = void 0;
 var rect_1 = require("./interval/rect");
@@ -129,2 +129,4 @@ Object.defineProperty(exports, "IntervalShape", { enumerable: true, get: function () { return rect_1.Rect; } });
 Object.defineProperty(exports, "ShapeShape", { enumerable: true, get: function () { return shape_1.Shape; } });
+var liquid_1 = require("./liquid/liquid");
+Object.defineProperty(exports, "LiquidShape", { enumerable: true, get: function () { return liquid_1.Liquid; } });
 //# sourceMappingURL=index.js.map

lib/spec/mark.d.ts

@@ -13,3 +13,3 @@ import { MarkComponent } from '../runtime';
 export type Mark = IntervalMark | RectMark | LineMark | PointMark | TextMark | CellMark | AreaMark | NodeMark | EdgeMark | ImageMark | PolygonMark | BoxMark | VectorMark | LineXMark | LineYMark | RangeMark | RangeXMark | RangeYMark | ConnectorMark | SankeyMark | PathMark | TreemapMark | PackMark | BoxPlotMark | ShapeMark | ForceGraphMark | TreeMark | WordCloudMark | DensityMark | CustomMark | CompositeMark;
-export type MarkTypes = 'interval' | 'rect' | 'line' | 'point' | 'text' | 'cell' | 'area' | 'node' | 'edge' | 'link' | 'image' | 'polygon' | 'box' | 'vector' | 'lineX' | 'lineY' | 'connector' | 'range' | 'rangeX' | 'rangeY' | 'sankey' | 'path' | 'treemap' | 'pack' | 'boxplot' | 'shape' | 'forceGraph' | 'tree' | 'wordCloud' | 'gauge' | 'density' | 'heatmap' | MarkComponent | CompositeMarkType;
+export type MarkTypes = 'interval' | 'rect' | 'line' | 'point' | 'text' | 'cell' | 'area' | 'node' | 'edge' | 'link' | 'image' | 'polygon' | 'box' | 'vector' | 'lineX' | 'lineY' | 'connector' | 'range' | 'rangeX' | 'rangeY' | 'sankey' | 'path' | 'treemap' | 'pack' | 'boxplot' | 'shape' | 'forceGraph' | 'tree' | 'wordCloud' | 'gauge' | 'density' | 'heatmap' | 'liquid' | MarkComponent | CompositeMarkType;
 export type ChannelTypes = 'x' | 'y' | 'z' | 'x1' | 'y1' | 'series' | 'color' | 'opacity' | 'shape' | 'size' | 'key' | 'groupKey' | 'position' | 'series' | 'enterType' | 'enterEasing' | 'enterDuration' | 'enterDelay' | 'updateType' | 'updateEasing' | 'updateDuration' | 'updateDelay' | 'exitType' | 'exitEasing' | 'exitDuration' | 'exitDelay' | `position${number}`;
@@ -194,2 +194,3 @@ export type PositionChannelTypes = 'x' | 'y' | 'z' | 'position' | `position${number}`;
 export type HeatmapMark = BaseMark<'heatmap'>;
+export type LiquidMark = BaseMark<'liquid'>;
 export type CustomMark = BaseMark<MarkComponent, ChannelTypes>;

lib/utils/helper.js

@@ -47,4 +47,12 @@ "use strict";
     for (const [key, value] of Object.entries(attributes)) {
-        if (!exclude.has(key))
-            target.attr(key, value);
+        if (!exclude.has(key)) {
+            // @todo Fix in @antv/g
+            if (key === 'transform') {
+                target.attr(key, '');
+                target.attr(key, value);
+            }
+            else {
+                target.attr(key, value);
+            }
+        }
     }
@@ -51,0 +59,0 @@ }

package.json

 {
   "name": "@antv/g2",
-  "version": "5.1.1",
+  "version": "5.1.2",
   "description": "the Grammar of Graphics in Javascript",
@@ -5,0 +5,0 @@ "license": "MIT",

src/api/chart.ts

 import { G2Spec } from '../spec';
-import { extend, API } from './extend';
+import { extend, API, CompositionAPI } from './extend';
 import { library } from './library';
 import { Runtime } from './runtime';
+import { MarkNode as Node } from './mark';
 import type { RuntimeOptions } from './runtime';
@@ -9,4 +10,8 @@
 
+export interface CompositionNode extends CompositionAPI<typeof library> {}
+
+export interface MarkNode extends Node {}
+
 export const Chart = extend(Runtime, library);
 
 export type ChartOptions = Omit<RuntimeOptions, 'lib'>;

src/api/extend.ts

@@ -8,13 +8,2 @@ import { G2Spec } from '../spec';
 
-type CompositionOf<Library> = Of<
-  Library,
-  (
-    composite?,
-  ) => CompositionNode<
-    CompositionOf<Library> & MarkOf<Library, (composite?) => MarkNode>
-  > &
-    MarkOf<Library, (composite?) => MarkNode> &
-    CompositionOf<Library>
->;
-
 type BuiltinComposition = {
@@ -25,2 +14,13 @@ 'composition.mark': any;
 
+export type CompositionOf<Library> = Of<
+  Library,
+  (composite?) => CompositionAPI<Library>
+>;
+
+export type CompositionAPI<Library> = CompositionNode<
+  CompositionOf<Library> & MarkOf<Library, (composite?) => MarkNode>
+> &
+  MarkOf<Library, (composite?) => MarkNode> &
+  CompositionOf<Library>;
+
 export type API<Spec, Library> = Runtime<Spec> &
@@ -27,0 +27,0 @@ MarkOf<Library, (composite?) => MarkNode> &

src/api/index.ts

@@ -1,6 +0,9 @@
-export { Chart, type ChartOptions } from './chart';
-export { MarkNode } from './mark';
-export { CompositionNode } from './composition';
+export {
+  Chart,
+  type ChartOptions,
+  type MarkNode,
+  type CompositionNode,
+} from './chart';
 export { register } from './library';
 export { Runtime } from './runtime';
 export { extend } from './extend';

src/api/runtime.ts

@@ -67,2 +67,3 @@ import { IRenderer, RendererPlugin, Canvas as GCanvas } from '@antv/g';
     if (!this._context.canvas) this._createCanvas();
+    this._context.canvas.getConfig().supportsCSSTransform = true;
     this._bindAutoFit();
@@ -69,0 +70,0 @@ this._rendering = true;

src/index.ts

@@ -33,4 +33,4 @@ import { runtime } from '@antv/g';
   Chart,
-  MarkNode,
-  CompositionNode,
+  type MarkNode,
+  type CompositionNode,
   register,
@@ -37,0 +37,0 @@ Runtime,

src/interaction/tooltip.ts

@@ -5,3 +5,3 @@ import { Circle, DisplayObject, IElement, Line } from '@antv/g';
 import { Tooltip as TooltipComponent } from '@antv/gui';
-import { Constant, Identity } from '@antv/scale';
+import { Constant, Identity, Band } from '@antv/scale';
 import { defined, subObject } from '../utils/helper';
@@ -189,3 +189,3 @@ import { isTranspose, isPolar } from '../utils/coordinate';
 function groupNameOf(scale, datum) {
-  const { color: scaleColor, series: scaleSeries } = scale;
+  const { color: scaleColor, series: scaleSeries, facet = false } = scale;
   const { color, series } = datum;
@@ -196,3 +196,3 @@ const invertAble = (scale) => {
       scale.invert &&
-      !(scale instanceof Identity) &&
+      !(scale instanceof Band) &&
       !(scale instanceof Constant)
@@ -203,3 +203,10 @@ );
   if (invertAble(scaleSeries)) return scaleSeries.invert(series);
-  if (series && series !== color) return series;
+  if (
+    series &&
+    scaleSeries instanceof Band &&
+    scaleSeries.invert(series) !== color &&
+    !facet
+  ) {
+    return scaleSeries.invert(series);
+  }
   if (invertAble(scaleColor)) {
@@ -730,2 +737,3 @@ const name = scaleColor.invert(color);
     bounding,
+    shared = false,
     body = true,
@@ -749,3 +757,3 @@ disableNative = false,
       const data =
-        group.length === 1
+        group.length === 1 && !shared
           ? singleItem(group[0])
@@ -905,2 +913,3 @@ : groupItems(group, scale, groupName);
       const startY = bbox.min[1];
+      Object.assign(scale, { facet: true });
 
@@ -933,4 +942,5 @@ // @todo Nested structure rather than flat structure for facet?
       view,
+      shared,
     });
   };
 }

src/lib/plot.ts

@@ -1,2 +0,2 @@
-import { Boxplot, WordCloud, Gauge } from '../mark';
+import { Boxplot, WordCloud, Gauge, Liquid } from '../mark';
 import { Venn } from '../data';
@@ -10,3 +10,4 @@
     'mark.wordCloud': WordCloud,
+    'mark.liquid': Liquid,
   } as const;
 }

src/mark/area.ts

@@ -88,3 +88,3 @@ import { group } from 'd3-array';
     { name: 'size' },
-    { name: 'series', scale: 'identity' },
+    { name: 'series', scale: 'band' },
   ],
@@ -91,0 +91,0 @@ preInference: [

src/mark/gauge.ts

@@ -1,2 +0,2 @@
-import { deepMix } from '@antv/util';
+import { deepMix, isNumber } from '@antv/util';
 import { Vector2 } from '@antv/coord';
@@ -127,12 +127,33 @@ import { Group } from '@antv/g';
 
-export type GaugeData = {
-  target?: number;
-  total?: number;
-  percent?: number;
-  name?: string;
-  thresholds?: number[];
-};
+export type GaugeData =
+  | {
+      target?: number;
+      total?: number;
+      percent?: number;
+      name?: string;
+      thresholds?: number[];
+    }
+  | number;
 
+function getGaugeData(data: GaugeData) {
+  if (isNumber(data)) {
+    // Percent range [0, 1].
+    const percent = Math.max(0, Math.min(data, 1));
+    return {
+      percent,
+      target: percent,
+      total: 1,
+    };
+  }
+  return data;
+}
+
 function dataTransform(data: GaugeData, scale) {
-  const { name = 'score', target, total, percent, thresholds = [] } = data;
+  const {
+    name = 'score',
+    target,
+    total,
+    percent,
+    thresholds = [],
+  } = getGaugeData(data);
   const _target = percent || target;
@@ -139,0 +160,0 @@ const _total = percent ? 1 : total;

src/mark/index.ts

@@ -33,2 +33,3 @@ export { Interval } from './interval';
 export { Heatmap } from './heatmap';
+export { Liquid } from './liquid';
 
@@ -63,1 +64,2 @@ export type { IntervalOptions } from './interval';
 export type { HeatmapOptions } from './heatmap';
+export type { LiquidOptions } from './liquid';

src/mark/line.ts

@@ -111,3 +111,3 @@ import { Vector } from '@antv/coord';
     { name: 'size' },
-    { name: 'series', scale: 'identity' },
+    { name: 'series', scale: 'band' },
   ],
@@ -114,0 +114,0 @@ preInference: [

src/runtime/plot.ts

@@ -425,2 +425,3 @@ import { Vector2 } from '@antv/coord';
   const mergedOptions = bubbleOptions(flattenOptions);
+
   // @todo Remove this.
@@ -431,2 +432,4 @@ // !!! NOTE: Mute original view options.
   options.coordinate = mergedOptions.coordinate;
+  // @ts-ignore
+  options.marks = [...mergedOptions.marks, ...mergedOptions.components];
 
@@ -433,0 +436,0 @@ const transformedOptions = coordinate2Transform(mergedOptions, library);

src/runtime/transform.ts

 import { Primitive } from 'd3-array';
-import { deepMix } from '@antv/util';
+import { deepMix, isNumber } from '@antv/util';
 import { format } from 'd3-format';
@@ -339,2 +339,4 @@ import { indexOf, mapObject } from '../utils/array';
 function normalizedDataSource(data) {
+  // Liquid、Gauge need number data.
+  if (isNumber(data)) return { type: 'inline', value: data };
   // Return null as a placeholder.
@@ -341,0 +343,0 @@ if (!data) return { type: 'inline', value: null };

src/shape/index.ts

@@ -63,2 +63,3 @@ export { Rect as IntervalShape } from './interval/rect';
 export { Shape as ShapeShape } from './shape/shape';
+export { Liquid as LiquidShape } from './liquid/liquid';
 
@@ -113,1 +114,2 @@ export type { RectOptions as IntervalShapeOptions } from './interval/rect';
 export type { ShapeOptions as ShapeShapeOptions } from './shape/shape';
+export type { LiquidOptions } from './liquid/liquid';

src/spec/mark.ts

@@ -86,2 +86,3 @@ import { MarkComponent } from '../runtime';
   | 'heatmap'
+  | 'liquid'
   | MarkComponent
@@ -391,3 +392,4 @@ | CompositeMarkType;
 export type HeatmapMark = BaseMark<'heatmap'>;
+export type LiquidMark = BaseMark<'liquid'>;
 
 export type CustomMark = BaseMark<MarkComponent, ChannelTypes>;

src/utils/helper.ts

@@ -48,3 +48,11 @@ import { DisplayObject } from '@antv/g';
   for (const [key, value] of Object.entries(attributes)) {
-    if (!exclude.has(key)) target.attr(key, value);
+    if (!exclude.has(key)) {
+      // @todo Fix in @antv/g
+      if (key === 'transform') {
+        target.attr(key, '');
+        target.attr(key, value);
+      } else {
+        target.attr(key, value);
+      }
+    }
   }
@@ -51,0 +59,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

8249977

increased by1.04%

Number of package files

2835

increased by1%

Lines of code

108130

increased by1.61%

No dependency changes