feat: annotation supports default title and content from properties

antvis · Aug 15, 2023 · 6bb30be · 6bb30be
1 parent eb767c7
commit 6bb30be
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 3 deletions.
diff --git a/packages/gi-assets-advance/src/components/GraphAnnotation/Component.tsx b/packages/gi-assets-advance/src/components/GraphAnnotation/Component.tsx
@@ -11,6 +11,8 @@ import $i18n from '../../i18n';
 export interface GraphAnnotationProps {
   contextmenu: any;
   annotationWay: string;
+  defaultTitleField?: string;
+  defaultContentFields?: string[];
 }
 
 const tagColors = [
@@ -51,7 +53,7 @@ const BADGE_CLASSNAME = 'gi-graph-annotation';
 let unbindSizeSensor;
 
 const GraphAnnotation: React.FunctionComponent<GraphAnnotationProps> = props => {
-  const { contextmenu, annotationWay } = props;
+  const { contextmenu, annotationWay, defaultTitleField, defaultContentFields } = props;
   const { graph, GISDK_ID } = useContext();
   const { item: menuTargetItem, x, y } = contextmenu; // target 为 null 可能是 canvas
   if (menuTargetItem && menuTargetItem.destroyed) {
@@ -89,10 +91,20 @@ const GraphAnnotation: React.FunctionComponent<GraphAnnotationProps> = props =>
         // onClickIcon: hideIconTooltip,
       },
       getTitle: item => {
+        if (defaultTitleField) return item.getModel()[defaultTitleField];
         const type = item.getType?.() || 'canvas';
         return menuItemName[type];
       },
-      getContent: (item => undefined) as any,
+      getContent: (item => {
+        if (defaultContentFields) {
+          const model = item.getModel();
+          return defaultContentFields
+            .map(field => (model.hasOwnProperty(field) ? `${field}: ${model[field]}` : undefined))
+            .filter(Boolean)
+            .join('\n\r');
+        }
+        return undefined;
+      }) as any,
       getContentPlaceholder: item =>
         $i18n.get({
           id: 'advance.components.GraphAnnotation.Component.DoubleClickHereToStart',

diff --git a/packages/gi-assets-advance/src/components/GraphAnnotation/registerMeta.ts b/packages/gi-assets-advance/src/components/GraphAnnotation/registerMeta.ts
@@ -27,7 +27,8 @@ const annotationWay = [
   },
 ];
 
-export default () => {
+export default context => {
+  const { keys } = context;
   return {
     annotationWay: {
       title: $i18n.get({ id: 'advance.components.GraphAnnotation.registerMeta.LabelingMethod', dm: '标注方式' }),
@@ -39,5 +40,33 @@ export default () => {
       },
       default: 'tag',
     },
+
+    defaultTitleField: {
+      title: '默认标题填充属性',
+      type: 'string',
+      'x-decorator': 'FormItem',
+      'x-component': 'Select',
+      'x-component-props': {
+        mode: 'single',
+        options: keys.map(c => {
+          return { label: c, value: c };
+        }),
+      },
+      default: undefined,
+    },
+
+    defaultContentFields: {
+      title: '默认内容填充属性',
+      type: 'string',
+      'x-decorator': 'FormItem',
+      'x-component': 'Select',
+      'x-component-props': {
+        mode: 'multiple',
+        options: keys.map(c => {
+          return { label: c, value: c };
+        }),
+      },
+      default: undefined,
+    },
   };
 };