fix: guide超出范围不显示 (#1944)

Co-authored-by: xuying.xu <xuying.xu@alibaba-inc.com>
antvis · Mar 22, 2024 · b2bee66 · b2bee66
1 parent 860b339
commit b2bee66
Show file tree

Hide file tree

Showing 9 changed files with 17 additions and 5 deletions.
diff --git a/packages/f2/src/components/guide/views/Arc.tsx b/packages/f2/src/components/guide/views/Arc.tsx
@@ -11,6 +11,8 @@ export interface ArcGuideProps extends GuideProps {
 export default (props: ArcGuideProps) => {
   const { theme = {} } = props;
   const { coord, points, style, animation } = deepMix({ ...theme.line }, props);
+  const checkNaN = points.some((d)=> isNaN(d.x) || isNaN(d.y));
+  if(checkNaN) return null;
 
   const start = points[0] || {};
   const end = points[1] || {};

diff --git a/packages/f2/src/components/guide/views/Image.tsx b/packages/f2/src/components/guide/views/Image.tsx
@@ -22,6 +22,8 @@ export default (props: ImageGuideProps, context) => {
   const cfg = deepMix({}, defaultProps, props);
   const { points, style, attrs, offsetX, offsetY, src, animation } = cfg;
   const { x, y } = points[0] || {};
+  if(isNaN(x) || isNaN(y)) return null;
+
   const { height = 0, width = 0 } = { ...attrs, ...style };
   const heightNum = context.px2hd(height + 'px');
   const widthNum = context.px2hd(width + 'px');

diff --git a/packages/f2/src/components/guide/views/Line.tsx b/packages/f2/src/components/guide/views/Line.tsx
@@ -13,6 +13,9 @@ export interface LineGuideProps extends GuideProps {
 export default (props: LineGuideProps, context) => {
   const { theme = {} } = props;
   const { points, style, offsetX, offsetY, animation } = deepMix({ ...theme.line }, props);
+  const checkNaN = points.some((d)=> isNaN(d.x) || isNaN(d.y));
+  if(checkNaN) return;
+
   const { x: x1, y: y1 } = points[0] || {};
   const { x: x2, y: y2 } = points[1] || {};
 

diff --git a/packages/f2/src/components/guide/views/Lottie.tsx b/packages/f2/src/components/guide/views/Lottie.tsx
@@ -28,6 +28,8 @@ export default (props: LottieGuideProps, context) => {
   const cfg = deepMix({}, defaultProps, props);
   const { points, style, offsetX, offsetY, lottieJson, animation, options } = cfg;
   const { x, y } = points[0] || {};
+  if(isNaN(x) || isNaN(y)) return null;
+
   const { height = 0, width = 0 } = style;
 
   const offsetXNum = context.px2hd(offsetX);

diff --git a/packages/f2/src/components/guide/views/Point.tsx b/packages/f2/src/components/guide/views/Point.tsx
@@ -14,7 +14,8 @@ export default (props: PointGuideProps, context) => {
   const { theme } = props;
   const { points, style, offsetX, offsetY, animation } = deepMix({ ...theme.point }, props);
   const { x, y } = points[0] || {};
-
+  if(isNaN(x) || isNaN(y)) return null;
+
   const offsetXNum = context.px2hd(offsetX);
   const offsetYNum = context.px2hd(offsetY);
   const posX = x + (offsetXNum || 0);

diff --git a/packages/f2/src/components/guide/views/Rect.tsx b/packages/f2/src/components/guide/views/Rect.tsx
@@ -11,7 +11,9 @@ export interface RectGuideProps extends GuideProps {
 export default (props: RectGuideProps) => {
   const { theme = {} } = props;
   const { points, style, animation } = deepMix({ ...theme.rect }, props);
-
+  const checkNaN = points.some((d)=> isNaN(d.x) || isNaN(d.y));
+  if(checkNaN) return null;
+
   const start = points[0] || {};
   const end = points[1] || {};
 

diff --git a/packages/f2/src/components/guide/views/Tag.tsx b/packages/f2/src/components/guide/views/Tag.tsx
@@ -95,7 +95,8 @@ export default class Tag extends Component<TagGuideProps> {
       textStyle,
     } = px2hd(cfg);
     const { x, y } = points[0] || {};
-
+    if(isNaN(x) || isNaN(y)) return null;
+
     const offsetXNum = context.px2hd(offsetX);
     const offsetYNum = context.px2hd(offsetY);
     let posX = x + (offsetXNum || 0);

diff --git a/packages/f2/src/components/guide/views/Text.tsx b/packages/f2/src/components/guide/views/Text.tsx
@@ -16,6 +16,7 @@ export default (props: TextGuideProps, context) => {
   const { points, style, offsetX, offsetY, content, animation } = deepMix({ ...theme.text }, props);
   const { x, y } = points[0] || {};
 
+  if(isNaN(x) || isNaN(y)) return null;
   const offsetXNum = context.px2hd(offsetX);
   const offsetYNum = context.px2hd(offsetY);
   const posX = x + (offsetXNum || 0);

diff --git a/packages/f2/src/components/guide/withGuide.tsx b/packages/f2/src/components/guide/withGuide.tsx
@@ -81,8 +81,6 @@ export default function<IProps extends GuideProps = GuideProps>(
       const { width, height } = context;
       const points = this.convertPoints(records);
       const theme = this.getGuideTheme();
-      const checkNaN = points.some((d)=> isNaN(d.x) || isNaN(d.y))
-      if(checkNaN) return;
 
       return (
         <group