fix: liquid data is not in object form antvis #6145

__tests__/plots/static/index.ts

@@ -301,6 +301,7 @@ export { liquidDiamond } from './liquid-diamond';
 export { liquidContent } from './liquid-content';
 export { liquidTriangle } from './liquid-triangle';
 export { liquidCustomShape } from './liquid-custom-shape';
+export { liquidNumber } from './liquid-number';
 export { alphabetIntervalAxisOptions } from './alphabet-interval-axis-options';
 export { profitIntervalAxisTransform } from './profit-interval-axis-transform';
 export { intervalPointBullet } from './interval-point-bullet';

__tests__/plots/static/liquid-number.ts

@@ -0,0 +1,11 @@
+import { G2Spec } from '../../../src';
+
+export function liquidNumber(): G2Spec {
+  return {
+    type: 'view',
+    data: 0.3,
+    children: [{ type: 'liquid' }],
+  };
+}
+
+liquidNumber.skip = true;

site/docs/spec/mark/liquid.zh.md

@@ -20,7 +20,7 @@ const chart = new Chart({
 
 chart
   .liquid()
-  .data({value:.3})
+  .data(0.3)
   .style({
     outlineBorder: 4,
     outlineDistance: 8,

site/examples/general/Liquid/demo/liquid-background.ts

@@ -5,7 +5,7 @@ const chart = new Chart({
   autoFit: true,
 });
 
-chart.liquid().data({ value: 0.3 }).style({
+chart.liquid().data(0.3).style({
   backgroundFill: 'pink',
 });
 

site/examples/general/Liquid/demo/liquid-content.ts

@@ -5,7 +5,7 @@ const chart = new Chart({
   autoFit: true,
 });
 
-chart.liquid().data({ value: 0.581 }).style({
+chart.liquid().data(0.581).style({
   contentFill: '#000',
   contentText: 'center text',
   contentStroke: '#fff',

site/examples/general/Liquid/demo/liquid-custom-shape.ts

@@ -7,7 +7,7 @@ const chart = new Chart({
 
 chart
   .liquid()
-  .data({ value: 0.3 })
+  .data(0.3)
   .style({
     shape: (x, y, r) => {
       const path = [];

site/examples/general/Liquid/demo/liquid-default.ts

@@ -5,7 +5,7 @@ const chart = new Chart({
   autoFit: true,
 });
 
-chart.liquid().data({ value: 0.3 }).style({
+chart.liquid().data(0.3).style({
   outlineBorder: 4,
   outlineDistance: 8,
   waveLength: 128,

site/examples/general/Liquid/demo/liquid-pin.ts

@@ -5,7 +5,7 @@ const chart = new Chart({
   autoFit: true,
 });
 
-chart.liquid().data({ value: 0.581 }).style({
+chart.liquid().data(0.581).style({
   shape: 'pin', // Build-in shapes: rect, circle, pin, diamond, triangle.
   contentFill: '#fff',
   outlineBorder: 4,

src/composition/utils.ts

@@ -16,12 +16,20 @@ export function useOverrideAdaptor<T>(adaptor: Adapter<T>): Adapter<T> {
   return (options?, ...rest) => deepMix({}, options, adaptor(options, ...rest));
 }
 
+export function isObject(d) {
+  if (d instanceof Date) return false;
+  return typeof d === 'object';
+}
+
 export function mergeData(
   dataDescriptor: any[] | { value: any; [key: string]: any },
   dataValue: any[],
 ) {
   if (!dataDescriptor) return dataValue;
   if (Array.isArray(dataDescriptor)) return dataDescriptor;
-  const { value = dataValue, ...rest } = dataDescriptor;
-  return { ...rest, value };
+  if (isObject(dataDescriptor)) {
+    const { value = dataValue, ...rest } = dataDescriptor;
+    return { ...rest, value };
+  }
+  return dataDescriptor;
 }