diff --git a/packages/gi-assets-advance/src/components/AddSheetbar/Component.tsx b/packages/gi-assets-advance/src/components/AddSheetbar/Component.tsx
index 15b63a442..346c98d23 100644
--- a/packages/gi-assets-advance/src/components/AddSheetbar/Component.tsx
+++ b/packages/gi-assets-advance/src/components/AddSheetbar/Component.tsx
@@ -45,11 +45,7 @@ const AddSheetbar: React.FunctionComponent<AddSheetbarProps> = props => {
       });
   }, [graph, handleAddSheetbar, isRelayout]);
 
-  return (
-    <>
-      <GIAComponent GIAC={GIAC} onClick={handleClick} />
-    </>
-  );
+  return <GIAComponent GIAC={GIAC} onClick={handleClick} />;
 };
 
 export default memo(AddSheetbar);
diff --git a/packages/gi-assets-advance/src/components/AddSheetbar/index.md b/packages/gi-assets-advance/src/components/AddSheetbar/index.md
deleted file mode 100755
index 78cddf581..000000000
--- a/packages/gi-assets-advance/src/components/AddSheetbar/index.md
+++ /dev/null
@@ -1,17 +0,0 @@
-## AddSheetbar 添加到新画布中
-
-```jsx
-import TestSDK, { Mock } from '@antv/gi-assets-testing';
-import * as React from 'react';
-import Asset from './index.tsx';
-
-const App = props => {
-  return (
-    <div>
-      <TestSDK asset={Asset} type="GIAC" />
-    </div>
-  );
-};
-
-export default App;
-```
diff --git a/packages/gi-assets-advance/src/components/AjustLayout/index.md b/packages/gi-assets-advance/src/components/AjustLayout/index.md
index ddc27b5c4..c497a18ff 100644
--- a/packages/gi-assets-advance/src/components/AjustLayout/index.md
+++ b/packages/gi-assets-advance/src/components/AjustLayout/index.md
@@ -1,26 +1,30 @@
-## AjustLayout 子图布局
+---
+title: 子图布局
+order: 0
+group:
+  title: 高级资产
+  path: /advance
+nav:
+  title: 资产包
+  path: /assets
+  order: 1
+---
 
 ```jsx
-import TestSDK, { Mock } from '@antv/gi-assets-testing';
-import { Utils } from '@antv/graphin';
 import * as React from 'react';
+import { GISDK_TEST } from '@antv/gi-sdk';
+import * as Assets from '@antv/gi-assets-basic';
 import Asset from './index.tsx';
 
-const services = [
-  {
-    id: 'GI_SERVICE_INTIAL_GRAPH',
-    service: params => {
-      return new Promise(resolve => {
-        resolve(Utils.mock(20).tree().graphin());
-      });
-    },
-  },
-];
+const { registerMeta, info } = Asset;
+const { id } = info;
 
-const App = props => {
+Assets.components[id] = Asset;
+
+const App = () => {
   return (
     <div>
-      <TestSDK asset={Asset} services={services} type="GIAC_CONTENT" />
+      <GISDK_TEST assets={Assets} activeAssets={[info]} />
     </div>
   );
 };
diff --git a/packages/gi-assets-advance/src/components/AnalysisHistory/index.md b/packages/gi-assets-advance/src/components/AnalysisHistory/index.md
deleted file mode 100755
index d0957bd84..000000000
--- a/packages/gi-assets-advance/src/components/AnalysisHistory/index.md
+++ /dev/null
@@ -1,17 +0,0 @@
-## AnalysisHistory 分析历史栏
-
-```jsx
-import TestSDK, { Mock } from '@antv/gi-assets-testing';
-import * as React from 'react';
-import Asset from './index.tsx';
-
-const App = props => {
-  return (
-    <div>
-      <TestSDK asset={Asset} type="GIAC" />
-    </div>
-  );
-};
-
-export default App;
-```
diff --git a/packages/gi-assets-advance/src/components/Assistant/index.md b/packages/gi-assets-advance/src/components/Assistant/index.md
new file mode 100644
index 000000000..904bb46c1
--- /dev/null
+++ b/packages/gi-assets-advance/src/components/Assistant/index.md
@@ -0,0 +1,33 @@
+---
+title: AI 助理
+order: 0
+group:
+  title: 高级资产
+  path: /advance
+nav:
+  title: 资产包
+  path: /assets
+  order: 1
+---
+
+```jsx
+import * as React from 'react';
+import { GISDK_TEST } from '@antv/gi-sdk';
+import * as Assets from '@antv/gi-assets-basic';
+import Asset from './index.ts';
+
+const { registerMeta, info } = Asset;
+const { id } = info;
+
+Assets.components[id] = Asset;
+
+const App = () => {
+  return (
+    <div>
+      <GISDK_TEST assets={Assets} activeAssets={[info]} />
+    </div>
+  );
+};
+
+export default App;
+```
diff --git a/packages/gi-assets-advance/src/components/CypherQuery/index.md b/packages/gi-assets-advance/src/components/CypherQuery/index.md
new file mode 100644
index 000000000..5ea7fd936
--- /dev/null
+++ b/packages/gi-assets-advance/src/components/CypherQuery/index.md
@@ -0,0 +1,33 @@
+---
+title: Cypher 语句查询
+order: 0
+group:
+  title: 高级资产
+  path: /advance
+nav:
+  title: 资产包
+  path: /assets
+  order: 1
+---
+
+```jsx
+import * as React from 'react';
+import { GISDK_TEST } from '@antv/gi-sdk';
+import * as Assets from '@antv/gi-assets-basic';
+import Asset from './index.ts';
+
+const { registerMeta, info } = Asset;
+const { id } = info;
+
+Assets.components[id] = Asset;
+
+const App = () => {
+  return (
+    <div>
+      <GISDK_TEST assets={Assets} activeAssets={[info]} />
+    </div>
+  );
+};
+
+export default App;
+```
diff --git a/packages/gi-assets-advance/src/components/GremlinQuery/index.md b/packages/gi-assets-advance/src/components/GremlinQuery/index.md
new file mode 100644
index 000000000..db5c0c824
--- /dev/null
+++ b/packages/gi-assets-advance/src/components/GremlinQuery/index.md
@@ -0,0 +1,33 @@
+---
+title: Gremlin 查询
+order: 0
+group:
+  title: 高级资产
+  path: /advance
+nav:
+  title: 资产包
+  path: /assets
+  order: 1
+---
+
+```jsx
+import * as React from 'react';
+import { GISDK_TEST } from '@antv/gi-sdk';
+import * as Assets from '@antv/gi-assets-basic';
+import Asset from './index.tsx';
+
+const { registerMeta, info } = Asset;
+const { id } = info;
+
+Assets.components[id] = Asset;
+
+const App = () => {
+  return (
+    <div>
+      <GISDK_TEST assets={Assets} activeAssets={[info]} />
+    </div>
+  );
+};
+
+export default App;
+```
diff --git a/packages/gi-assets-advance/src/components/JSONMode/index.md b/packages/gi-assets-advance/src/components/JSONMode/index.md
new file mode 100644
index 000000000..60a15c7f8
--- /dev/null
+++ b/packages/gi-assets-advance/src/components/JSONMode/index.md
@@ -0,0 +1,33 @@
+---
+title: 代码模式
+order: 0
+group:
+  title: 高级资产
+  path: /advance
+nav:
+  title: 资产包
+  path: /assets
+  order: 1
+---
+
+```jsx
+import * as React from 'react';
+import { GISDK_TEST } from '@antv/gi-sdk';
+import * as Assets from '@antv/gi-assets-basic';
+import Asset from './index.tsx';
+
+const { registerMeta, info } = Asset;
+const { id } = info;
+
+Assets.components[id] = Asset;
+
+const App = () => {
+  return (
+    <div>
+      <GISDK_TEST assets={Assets} activeAssets={[info]} />
+    </div>
+  );
+};
+
+export default App;
+```
diff --git a/packages/gi-assets-advance/src/components/Redo/index.md b/packages/gi-assets-advance/src/components/Redo/index.md
deleted file mode 100755
index 06605aca4..000000000
--- a/packages/gi-assets-advance/src/components/Redo/index.md
+++ /dev/null
@@ -1,17 +0,0 @@
-## Redo 重做
-
-```jsx
-import TestSDK, { Mock } from '@antv/gi-assets-testing';
-import * as React from 'react';
-import Asset from './index.tsx';
-
-const App = props => {
-  return (
-    <div>
-      <TestSDK asset={Asset} type="GIAC" />
-    </div>
-  );
-};
-
-export default App;
-```
diff --git a/packages/gi-assets-advance/src/components/Sheetbar/index.md b/packages/gi-assets-advance/src/components/Sheetbar/index.md
deleted file mode 100755
index af26756ba..000000000
--- a/packages/gi-assets-advance/src/components/Sheetbar/index.md
+++ /dev/null
@@ -1,17 +0,0 @@
-## Sheetbar 多画布
-
-```jsx
-import TestSDK, { Mock } from '@antv/gi-assets-testing';
-import * as React from 'react';
-import Asset from './index.tsx';
-
-const App = props => {
-  return (
-    <div>
-      <TestSDK asset={Asset} type="GIAC" />
-    </div>
-  );
-};
-
-export default App;
-```
diff --git a/packages/gi-assets-advance/src/components/StructAnalysis/index.md b/packages/gi-assets-advance/src/components/StructAnalysis/index.md
new file mode 100644
index 000000000..890864679
--- /dev/null
+++ b/packages/gi-assets-advance/src/components/StructAnalysis/index.md
@@ -0,0 +1,33 @@
+---
+title: 路径结构分析
+order: 0
+group:
+  title: 高级资产
+  path: /advance
+nav:
+  title: 资产包
+  path: /assets
+  order: 1
+---
+
+```jsx
+import * as React from 'react';
+import { GISDK_TEST } from '@antv/gi-sdk';
+import * as Assets from '@antv/gi-assets-basic';
+import Asset from './index.tsx';
+
+const { registerMeta, info } = Asset;
+const { id } = info;
+
+Assets.components[id] = Asset;
+
+const App = () => {
+  return (
+    <div>
+      <GISDK_TEST assets={Assets} activeAssets={[info]} />
+    </div>
+  );
+};
+
+export default App;
+```
diff --git a/packages/gi-assets-advance/src/components/StyleSetting/index.md b/packages/gi-assets-advance/src/components/StyleSetting/index.md
index 9f0c64426..781b7e5b7 100644
--- a/packages/gi-assets-advance/src/components/StyleSetting/index.md
+++ b/packages/gi-assets-advance/src/components/StyleSetting/index.md
@@ -1,56 +1,30 @@
-## StyleSetting 样式设置
+---
+title: 样式设置
+order: 0
+group:
+  title: 高级资产
+  path: /advance
+nav:
+  title: 资产包
+  path: /assets
+  order: 1
+---
 
 ```jsx
-import TestSDK, { Mock } from '@antv/gi-assets-testing';
 import * as React from 'react';
-import StyleSetting from './Component.tsx';
+import { GISDK_TEST } from '@antv/gi-sdk';
+import * as Assets from '@antv/gi-assets-basic';
 import Asset from './index.tsx';
 
-// <TestSDK asset={Asset} />
+const { registerMeta, info } = Asset;
+const { id } = info;
 
-const nodes = {
-  uId: '112',
-  name: '',
-  pt: 'user',
-  age: 23,
-};
+Assets.components[id] = Asset;
 
-const data = {
-  nodes: [
-    {
-      id: 'node1',
-      nodeType: 'User',
-      // 默认ID
-      label: 'xxx',
-      data: {
-        id: 'node1',
-        nodeType: 'User',
-        // 默认ID
-        label: 'xxx',
-      },
-    },
-    {
-      id: 'node1',
-      label: 'Car',
-      data: {
-        id: 'node1',
-        label: 'Car',
-      },
-    },
-  ],
-  edges: [
-    {
-      source: 'node1',
-      target: 'node1',
-      edgeType: 'edge1',
-    },
-  ],
-};
-const App = props => {
-  //<StyleSetting data={data} shapeOptions={[]} />
+const App = () => {
   return (
     <div>
-      <TestSDK asset={Asset} type="GIAC_CONTENT" />
+      <GISDK_TEST assets={Assets} activeAssets={[info]} />
     </div>
   );
 };
diff --git a/packages/gi-assets-advance/src/components/SubGraphLayout/index.md b/packages/gi-assets-advance/src/components/SubGraphLayout/index.md
deleted file mode 100644
index ddc27b5c4..000000000
--- a/packages/gi-assets-advance/src/components/SubGraphLayout/index.md
+++ /dev/null
@@ -1,29 +0,0 @@
-## AjustLayout 子图布局
-
-```jsx
-import TestSDK, { Mock } from '@antv/gi-assets-testing';
-import { Utils } from '@antv/graphin';
-import * as React from 'react';
-import Asset from './index.tsx';
-
-const services = [
-  {
-    id: 'GI_SERVICE_INTIAL_GRAPH',
-    service: params => {
-      return new Promise(resolve => {
-        resolve(Utils.mock(20).tree().graphin());
-      });
-    },
-  },
-];
-
-const App = props => {
-  return (
-    <div>
-      <TestSDK asset={Asset} services={services} type="GIAC_CONTENT" />
-    </div>
-  );
-};
-
-export default App;
-```
diff --git a/packages/gi-assets-advance/src/components/ThemeSetting/index.md b/packages/gi-assets-advance/src/components/ThemeSetting/index.md
new file mode 100644
index 000000000..ebf6add76
--- /dev/null
+++ b/packages/gi-assets-advance/src/components/ThemeSetting/index.md
@@ -0,0 +1,33 @@
+---
+title: 主题设置
+order: 0
+group:
+  title: 高级资产
+  path: /advance
+nav:
+  title: 资产包
+  path: /assets
+  order: 1
+---
+
+```jsx
+import * as React from 'react';
+import { GISDK_TEST } from '@antv/gi-sdk';
+import * as Assets from '@antv/gi-assets-basic';
+import Asset from './index.tsx';
+
+const { registerMeta, info } = Asset;
+const { id } = info;
+
+Assets.components[id] = Asset;
+
+const App = () => {
+  return (
+    <div>
+      <GISDK_TEST assets={Assets} activeAssets={[info]} />
+    </div>
+  );
+};
+
+export default App;
+```
diff --git a/packages/gi-assets-advance/src/components/Undo/index.md b/packages/gi-assets-advance/src/components/Undo/index.md
deleted file mode 100755
index b536f0b90..000000000
--- a/packages/gi-assets-advance/src/components/Undo/index.md
+++ /dev/null
@@ -1,17 +0,0 @@
-## Undo 撤销
-
-```jsx
-import TestSDK, { Mock } from '@antv/gi-assets-testing';
-import * as React from 'react';
-import Asset from './index.tsx';
-
-const App = props => {
-  return (
-    <div>
-      <TestSDK asset={Asset} type="GIAC" />
-    </div>
-  );
-};
-
-export default App;
-```