{"expireTime":9007200828528711000,"key":"transformer-remark-markdown-ast-19c909a584cb04f404739b075ec209b0-gatsby-remark-prettiergatsby-remark-prismjsgatsby-remark-external-linksgatsby-remark-autolink-headersgatsby-remark-reading-time-","val":{"type":"root","children":[{"type":"heading","depth":2,"children":[{"type":"link","url":"#什么是-graph","title":null,"children":[],"data":{"hProperties":{"aria-label":"什么是 graph permalink","class":"anchor"},"hChildren":[{"type":"raw","value":"<svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>"}]}},{"type":"text","value":"什么是 Graph","position":{"start":{"line":2,"column":4,"offset":4},"end":{"line":2,"column":13,"offset":13},"indent":[]}}],"position":{"start":{"line":2,"column":1,"offset":1},"end":{"line":2,"column":13,"offset":13},"indent":[]},"data":{"id":"什么是-graph","htmlAttributes":{"id":"什么是-graph"},"hProperties":{"id":"什么是-graph"}}},{"type":"paragraph","children":[{"type":"text","value":"中文字“图”在大家的传统认知里指的是图画、图像，而图论与可视化中的“图”—— Graph 则有着更精确的定位：主体（objects）与关系（relationships）的组成。它甚至不局限于视觉，主体与关系的数据也可以称为图。","position":{"start":{"line":3,"column":1,"offset":14},"end":{"line":3,"column":114,"offset":127},"indent":[]}},{"type":"html","value":"<br />","position":{"start":{"line":3,"column":114,"offset":127},"end":{"line":3,"column":120,"offset":133},"indent":[]}},{"type":"text","value":"\n—— 摘自 ","position":{"start":{"line":3,"column":120,"offset":133},"end":{"line":4,"column":7,"offset":140},"indent":[1]}},{"type":"link","title":null,"url":"https://zhuanlan.zhihu.com/aiux-antv","children":[{"type":"text","value":"AntV 专栏","position":{"start":{"line":4,"column":8,"offset":141},"end":{"line":4,"column":15,"offset":148},"indent":[]}}],"position":{"start":{"line":4,"column":7,"offset":140},"end":{"line":4,"column":54,"offset":187},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"文章：Graph Visualization ·","position":{"start":{"line":4,"column":54,"offset":187},"end":{"line":4,"column":78,"offset":211},"indent":[]}},{"type":"link","title":null,"url":"https://zhuanlan.zhihu.com/p/83685690","children":[{"type":"text","value":" ","position":{"start":{"line":4,"column":79,"offset":212},"end":{"line":4,"column":80,"offset":213},"indent":[]}}],"position":{"start":{"line":4,"column":78,"offset":211},"end":{"line":4,"column":120,"offset":253},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"知多少 之 《","position":{"start":{"line":4,"column":120,"offset":253},"end":{"line":4,"column":127,"offset":260},"indent":[]}},{"type":"link","title":null,"url":"https://zhuanlan.zhihu.com/p/83685690","children":[{"type":"text","value":"HelloWorld","position":{"start":{"line":4,"column":128,"offset":261},"end":{"line":4,"column":138,"offset":271},"indent":[]}}],"position":{"start":{"line":4,"column":127,"offset":260},"end":{"line":4,"column":178,"offset":311},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":" ","position":{"start":{"line":4,"column":178,"offset":311},"end":{"line":4,"column":179,"offset":312},"indent":[]}},{"type":"link","title":null,"url":"https://zhuanlan.zhihu.com/p/83685690","children":[{"type":"text","value":"图可视化","position":{"start":{"line":4,"column":180,"offset":313},"end":{"line":4,"column":184,"offset":317},"indent":[]}}],"position":{"start":{"line":4,"column":179,"offset":312},"end":{"line":4,"column":224,"offset":357},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"》","position":{"start":{"line":4,"column":224,"offset":357},"end":{"line":4,"column":225,"offset":358},"indent":[]}}],"position":{"start":{"line":3,"column":1,"offset":14},"end":{"line":4,"column":225,"offset":358},"indent":[1]}},{"type":"paragraph","children":[{"type":"text","value":"在 G6 中，Graph 对象是图的载体，它包含了图上的所有元素（节点、边等），同时挂载了图的相关操作（如交互监听、元素操作、渲染等）。","position":{"start":{"line":6,"column":1,"offset":360},"end":{"line":6,"column":69,"offset":428},"indent":[]}},{"type":"html","value":"<br />","position":{"start":{"line":6,"column":69,"offset":428},"end":{"line":6,"column":75,"offset":434},"indent":[]}},{"type":"text","value":"Graph 对象的生命周期为：初始化 —> 加载数据 —> 渲染 —> 更新 —> 销毁。","position":{"start":{"line":6,"column":75,"offset":434},"end":{"line":6,"column":120,"offset":479},"indent":[]}}],"position":{"start":{"line":6,"column":1,"offset":360},"end":{"line":6,"column":120,"offset":479},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"在 ","position":{"start":{"line":8,"column":1,"offset":481},"end":{"line":8,"column":3,"offset":483},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/intro#56Nwj","children":[{"type":"text","value":"快速上手","position":{"start":{"line":8,"column":4,"offset":484},"end":{"line":8,"column":8,"offset":488},"indent":[]}}],"position":{"start":{"line":8,"column":3,"offset":483},"end":{"line":8,"column":52,"offset":532},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":" 中，我们简单介绍了 初始化、加载数据、渲染图 的使用方法。本文将主要介绍初始化/实例化图。","position":{"start":{"line":8,"column":52,"offset":532},"end":{"line":8,"column":98,"offset":578},"indent":[]}}],"position":{"start":{"line":8,"column":1,"offset":481},"end":{"line":8,"column":98,"offset":578},"indent":[]}},{"type":"heading","depth":2,"children":[{"type":"link","url":"#前提代码","title":null,"children":[],"data":{"hProperties":{"aria-label":"前提代码 permalink","class":"anchor"},"hChildren":[{"type":"raw","value":"<svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>"}]}},{"type":"text","value":"前提代码","position":{"start":{"line":10,"column":4,"offset":583},"end":{"line":10,"column":8,"offset":587},"indent":[]}}],"position":{"start":{"line":10,"column":1,"offset":580},"end":{"line":10,"column":8,"offset":587},"indent":[]},"data":{"id":"前提代码","htmlAttributes":{"id":"前提代码"},"hProperties":{"id":"前提代码"}}},{"type":"paragraph","children":[{"type":"text","value":"本文的讲解将会基于下面这份内嵌 JavaScript 的 HTML 代码。该代码通过定义数据、实例化图、读取数据、渲染图等操作中完成了下图中简单的图：","position":{"start":{"line":11,"column":1,"offset":588},"end":{"line":11,"column":76,"offset":663},"indent":[]}},{"type":"html","value":"<br />","position":{"start":{"line":11,"column":76,"offset":663},"end":{"line":11,"column":82,"offset":669},"indent":[]}},{"type":"text","value":"\n","position":{"start":{"line":11,"column":82,"offset":669},"end":{"line":12,"column":1,"offset":670},"indent":[1]}},{"type":"html","value":"<img src='https://cdn.nlark.com/yuque/0/2019/png/156681/1571034737611-563c61e5-d3c0-407b-89fc-ca8c6fb97f66.png#align=left&display=inline&height=29&name=image.png&originHeight=148&originWidth=736&search=&size=20441&status=done&width=146' width='400' height='80' />","position":{"start":{"line":12,"column":1,"offset":670},"end":{"line":12,"column":264,"offset":933},"indent":[]}}],"position":{"start":{"line":11,"column":1,"offset":588},"end":{"line":12,"column":264,"offset":933},"indent":[1]}},{"type":"html","lang":"html","meta":null,"value":"<div class=\"gatsby-highlight\" data-language=\"html\"><pre class=\"language-html\"><code class=\"language-html\"><span class=\"token doctype\">&lt;!DOCTYPE html></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>html</span> <span class=\"token attr-name\">lang</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>en<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>head</span><span class=\"token punctuation\">></span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>meta</span> <span class=\"token attr-name\">charset</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>UTF-8<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>title</span><span class=\"token punctuation\">></span></span>Tutorial Demo<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>title</span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>head</span><span class=\"token punctuation\">></span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>body</span><span class=\"token punctuation\">></span></span>\n    /* 图的画布容器 */\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mountNode<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">></span></span>\n    /* 引入 G6 */\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://gw.alipayobjects.com/os/antv/pkg/_antv.g6-3.1.0/build/g6.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">></span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span><span class=\"token punctuation\">></span></span><span class=\"token script\"><span class=\"token language-javascript\">\n      <span class=\"token comment\">// 定义数据源</span>\n      <span class=\"token keyword\">const</span> data <span class=\"token operator\">=</span> <span class=\"token punctuation\">{</span>\n        <span class=\"token comment\">// 点集</span>\n        nodes<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">[</span><span class=\"token punctuation\">{</span>\n          id<span class=\"token punctuation\">:</span> <span class=\"token string\">'node1'</span><span class=\"token punctuation\">,</span>\n          x<span class=\"token punctuation\">:</span> <span class=\"token number\">100</span><span class=\"token punctuation\">,</span>\n          y<span class=\"token punctuation\">:</span> <span class=\"token number\">200</span>\n        <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span><span class=\"token punctuation\">{</span>\n          id<span class=\"token punctuation\">:</span> <span class=\"token string\">'node2'</span><span class=\"token punctuation\">,</span>\n          x<span class=\"token punctuation\">:</span> <span class=\"token number\">300</span><span class=\"token punctuation\">,</span>\n          y<span class=\"token punctuation\">:</span> <span class=\"token number\">200</span>\n        <span class=\"token punctuation\">}</span><span class=\"token punctuation\">]</span><span class=\"token punctuation\">,</span>\n        <span class=\"token comment\">// 边集</span>\n        edges<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">[</span>\n          <span class=\"token comment\">// 表示一条从 node1 节点连接到 node2 节点的边</span>\n          <span class=\"token punctuation\">{</span>\n            source<span class=\"token punctuation\">:</span> <span class=\"token string\">'node1'</span><span class=\"token punctuation\">,</span>\n            target<span class=\"token punctuation\">:</span> <span class=\"token string\">'node2'</span>\n          <span class=\"token punctuation\">}</span>\n        <span class=\"token punctuation\">]</span>\n      <span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</span>\n      \n      <span class=\"token comment\">// 创建 G6 图实例</span>\n      <span class=\"token keyword\">const</span> graph <span class=\"token operator\">=</span> <span class=\"token keyword\">new</span> <span class=\"token class-name\">G6<span class=\"token punctuation\">.</span>Graph</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n        container<span class=\"token punctuation\">:</span> <span class=\"token string\">'mountNode'</span><span class=\"token punctuation\">,</span> <span class=\"token comment\">// 指定图画布的容器 id，与第 9 行的容器对应</span>\n        <span class=\"token comment\">// 画布宽高</span>\n        width<span class=\"token punctuation\">:</span> <span class=\"token number\">800</span><span class=\"token punctuation\">,</span>\n        height<span class=\"token punctuation\">:</span> <span class=\"token number\">500</span>\n      <span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n      <span class=\"token comment\">// 读取数据</span>\n      graph<span class=\"token punctuation\">.</span><span class=\"token function\">data</span><span class=\"token punctuation\">(</span>data<span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n      <span class=\"token comment\">// 渲染图</span>\n      graph<span class=\"token punctuation\">.</span><span class=\"token function\">render</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n    </span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">></span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>body</span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>html</span><span class=\"token punctuation\">></span></span></code></pre></div>","position":{"start":{"line":14,"column":1,"offset":935},"end":{"line":63,"column":4,"offset":1904},"indent":[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1]}},{"type":"heading","depth":2,"children":[{"type":"link","url":"#初始化实例化图","title":null,"children":[],"data":{"hProperties":{"aria-label":"初始化实例化图 permalink","class":"anchor"},"hChildren":[{"type":"raw","value":"<svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>"}]}},{"type":"text","value":"初始化/实例化图","position":{"start":{"line":65,"column":4,"offset":1909},"end":{"line":65,"column":12,"offset":1917},"indent":[]}}],"position":{"start":{"line":65,"column":1,"offset":1906},"end":{"line":65,"column":12,"offset":1917},"indent":[]},"data":{"id":"初始化实例化图","htmlAttributes":{"id":"初始化实例化图"},"hProperties":{"id":"初始化实例化图"}}},{"type":"paragraph","children":[{"type":"text","value":"通过 ","position":{"start":{"line":66,"column":1,"offset":1918},"end":{"line":66,"column":4,"offset":1921},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">new G6.Graph(config)</code>","position":{"start":{"line":66,"column":4,"offset":1921},"end":{"line":66,"column":26,"offset":1943},"indent":[]}},{"type":"text","value":" 进行图的实例化。其中参数 ","position":{"start":{"line":66,"column":26,"offset":1943},"end":{"line":66,"column":40,"offset":1957},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">config</code>","position":{"start":{"line":66,"column":40,"offset":1957},"end":{"line":66,"column":48,"offset":1965},"indent":[]}},{"type":"text","value":" 是 Object 类型的图的配置项，图的大部分功能可以通过该配置项进行全局配置。如 ","position":{"start":{"line":66,"column":48,"offset":1965},"end":{"line":66,"column":91,"offset":2008},"indent":[]}},{"type":"link","title":null,"url":"#cRVfC","children":[{"type":"text","value":"前提代码","position":{"start":{"line":66,"column":92,"offset":2009},"end":{"line":66,"column":96,"offset":2013},"indent":[]}}],"position":{"start":{"line":66,"column":91,"offset":2008},"end":{"line":66,"column":105,"offset":2022},"indent":[]}},{"type":"text","value":" 这样实例化图：","position":{"start":{"line":66,"column":105,"offset":2022},"end":{"line":66,"column":113,"offset":2030},"indent":[]}}],"position":{"start":{"line":66,"column":1,"offset":1918},"end":{"line":66,"column":113,"offset":2030},"indent":[]}},{"type":"html","lang":"javascript","meta":null,"value":"<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\"><span class=\"token keyword\">const</span> graph <span class=\"token operator\">=</span> <span class=\"token keyword\">new</span> <span class=\"token class-name\">G6<span class=\"token punctuation\">.</span>Graph</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n  container<span class=\"token punctuation\">:</span> <span class=\"token string\">'mountNode'</span><span class=\"token punctuation\">,</span> <span class=\"token comment\">// 指定图画布的容器 id，与第 9 行的容器对应</span>\n  <span class=\"token comment\">// 画布宽高</span>\n  width<span class=\"token punctuation\">:</span> <span class=\"token number\">800</span><span class=\"token punctuation\">,</span>\n  height<span class=\"token punctuation\">:</span> <span class=\"token number\">500</span><span class=\"token punctuation\">,</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>","position":{"start":{"line":67,"column":1,"offset":2031},"end":{"line":74,"column":4,"offset":2178},"indent":[1,1,1,1,1,1,1]}},{"type":"heading","depth":3,"children":[{"type":"link","url":"#必要配置项","title":null,"children":[],"data":{"hProperties":{"aria-label":"必要配置项 permalink","class":"anchor"},"hChildren":[{"type":"raw","value":"<svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>"}]}},{"type":"text","value":"必要配置项","position":{"start":{"line":76,"column":5,"offset":2184},"end":{"line":76,"column":10,"offset":2189},"indent":[]}}],"position":{"start":{"line":76,"column":1,"offset":2180},"end":{"line":76,"column":10,"offset":2189},"indent":[]},"data":{"id":"必要配置项","htmlAttributes":{"id":"必要配置项"},"hProperties":{"id":"必要配置项"}}},{"type":"paragraph","children":[{"type":"text","value":"上面代码中实例化 Graph 的部分使用了三个必要的配置项：","position":{"start":{"line":77,"column":1,"offset":2190},"end":{"line":77,"column":31,"offset":2220},"indent":[]}}],"position":{"start":{"line":77,"column":1,"offset":2190},"end":{"line":77,"column":31,"offset":2220},"indent":[]}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">container</code>","position":{"start":{"line":79,"column":3,"offset":2224},"end":{"line":79,"column":14,"offset":2235},"indent":[]}}],"position":{"start":{"line":79,"column":3,"offset":2224},"end":{"line":79,"column":14,"offset":2235},"indent":[]}}],"position":{"start":{"line":79,"column":1,"offset":2222},"end":{"line":79,"column":14,"offset":2235},"indent":[]}}],"position":{"start":{"line":79,"column":1,"offset":2222},"end":{"line":79,"column":14,"offset":2235},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"     类型：String | Object。图的 DOM 容器。可以是 String，为 DOM 容器的 ","position":{"start":{"line":81,"column":1,"offset":2237},"end":{"line":81,"column":56,"offset":2292},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">id</code>","position":{"start":{"line":81,"column":56,"offset":2292},"end":{"line":81,"column":60,"offset":2296},"indent":[]}},{"type":"text","value":"。也可以是 Object ，为 DOM 对象。","position":{"start":{"line":81,"column":60,"offset":2296},"end":{"line":81,"column":83,"offset":2319},"indent":[]}}],"position":{"start":{"line":81,"column":1,"offset":2237},"end":{"line":81,"column":83,"offset":2319},"indent":[]}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">width</code>","position":{"start":{"line":83,"column":3,"offset":2323},"end":{"line":83,"column":10,"offset":2330},"indent":[]}},{"type":"text","value":"、","position":{"start":{"line":83,"column":10,"offset":2330},"end":{"line":83,"column":11,"offset":2331},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">height</code>","position":{"start":{"line":83,"column":11,"offset":2331},"end":{"line":83,"column":19,"offset":2339},"indent":[]}}],"position":{"start":{"line":83,"column":3,"offset":2323},"end":{"line":83,"column":19,"offset":2339},"indent":[]}}],"position":{"start":{"line":83,"column":1,"offset":2321},"end":{"line":83,"column":19,"offset":2339},"indent":[]}}],"position":{"start":{"line":83,"column":1,"offset":2321},"end":{"line":83,"column":19,"offset":2339},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"     类型：Number。图的画布的宽度和高度。","position":{"start":{"line":85,"column":1,"offset":2341},"end":{"line":85,"column":27,"offset":2367},"indent":[]}}],"position":{"start":{"line":85,"column":1,"offset":2341},"end":{"line":85,"column":27,"offset":2367},"indent":[]}},{"type":"heading","depth":3,"children":[{"type":"link","url":"#常用配置项","title":null,"children":[],"data":{"hProperties":{"aria-label":"常用配置项 permalink","class":"anchor"},"hChildren":[{"type":"raw","value":"<svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>"}]}},{"type":"text","value":"常用配置项","position":{"start":{"line":87,"column":5,"offset":2373},"end":{"line":87,"column":10,"offset":2378},"indent":[]}}],"position":{"start":{"line":87,"column":1,"offset":2369},"end":{"line":87,"column":10,"offset":2378},"indent":[]},"data":{"id":"常用配置项","htmlAttributes":{"id":"常用配置项"},"hProperties":{"id":"常用配置项"}}},{"type":"paragraph","children":[{"type":"text","value":"下面列举实例化图时常见的配置项，完整的配置项参见 ","position":{"start":{"line":88,"column":1,"offset":2379},"end":{"line":88,"column":26,"offset":2404},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/graph","children":[{"type":"text","value":"Graph API","position":{"start":{"line":88,"column":27,"offset":2405},"end":{"line":88,"column":36,"offset":2414},"indent":[]}}],"position":{"start":{"line":88,"column":26,"offset":2404},"end":{"line":88,"column":74,"offset":2452},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"。","position":{"start":{"line":88,"column":74,"offset":2452},"end":{"line":88,"column":75,"offset":2453},"indent":[]}}],"position":{"start":{"line":88,"column":1,"offset":2379},"end":{"line":88,"column":75,"offset":2453},"indent":[]}},{"type":"heading","depth":4,"children":[{"type":"link","url":"#整体渲染相关","title":null,"children":[],"data":{"hProperties":{"aria-label":"整体渲染相关 permalink","class":"anchor"},"hChildren":[{"type":"raw","value":"<svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>"}]}},{"type":"text","value":"整体渲染相关","position":{"start":{"line":90,"column":6,"offset":2460},"end":{"line":90,"column":12,"offset":2466},"indent":[]}}],"position":{"start":{"line":90,"column":1,"offset":2455},"end":{"line":90,"column":12,"offset":2466},"indent":[]},"data":{"id":"整体渲染相关","htmlAttributes":{"id":"整体渲染相关"},"hProperties":{"id":"整体渲染相关"}}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">renderer</code>","position":{"start":{"line":92,"column":3,"offset":2470},"end":{"line":92,"column":13,"offset":2480},"indent":[]}}],"position":{"start":{"line":92,"column":3,"offset":2470},"end":{"line":92,"column":13,"offset":2480},"indent":[]}}],"position":{"start":{"line":92,"column":1,"offset":2468},"end":{"line":92,"column":13,"offset":2480},"indent":[]}}],"position":{"start":{"line":92,"column":1,"offset":2468},"end":{"line":92,"column":13,"offset":2480},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"      类型：String；选项：","position":{"start":{"line":94,"column":1,"offset":2482},"end":{"line":94,"column":20,"offset":2501},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">&#39;svg&#39;</code>","position":{"start":{"line":94,"column":20,"offset":2501},"end":{"line":94,"column":27,"offset":2508},"indent":[]}},{"type":"text","value":" | ","position":{"start":{"line":94,"column":27,"offset":2508},"end":{"line":94,"column":30,"offset":2511},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">&#39;canvas&#39;</code>","position":{"start":{"line":94,"column":30,"offset":2511},"end":{"line":94,"column":41,"offset":2522},"indent":[]}},{"type":"text","value":"；默认：","position":{"start":{"line":94,"column":41,"offset":2522},"end":{"line":94,"column":45,"offset":2526},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">&#39;canvas&#39;</code>","position":{"start":{"line":94,"column":45,"offset":2526},"end":{"line":94,"column":55,"offset":2536},"indent":[]}},{"type":"text","value":"。选择 SVG 或 Canvas 方式渲染。","position":{"start":{"line":94,"column":55,"offset":2536},"end":{"line":94,"column":77,"offset":2558},"indent":[]}}],"position":{"start":{"line":94,"column":1,"offset":2482},"end":{"line":94,"column":77,"offset":2558},"indent":[]}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">fitView</code>","position":{"start":{"line":96,"column":3,"offset":2562},"end":{"line":96,"column":12,"offset":2571},"indent":[]}}],"position":{"start":{"line":96,"column":3,"offset":2562},"end":{"line":96,"column":12,"offset":2571},"indent":[]}}],"position":{"start":{"line":96,"column":1,"offset":2560},"end":{"line":96,"column":12,"offset":2571},"indent":[]}}],"position":{"start":{"line":96,"column":1,"offset":2560},"end":{"line":96,"column":12,"offset":2571},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"      类型：Boolean；默认：'false'。图是否自适应画布。","position":{"start":{"line":98,"column":1,"offset":2573},"end":{"line":98,"column":38,"offset":2610},"indent":[]}}],"position":{"start":{"line":98,"column":1,"offset":2573},"end":{"line":98,"column":38,"offset":2610},"indent":[]}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">fitViewPadding</code>","position":{"start":{"line":100,"column":3,"offset":2614},"end":{"line":100,"column":19,"offset":2630},"indent":[]}}],"position":{"start":{"line":100,"column":3,"offset":2614},"end":{"line":100,"column":19,"offset":2630},"indent":[]}}],"position":{"start":{"line":100,"column":1,"offset":2612},"end":{"line":100,"column":19,"offset":2630},"indent":[]}}],"position":{"start":{"line":100,"column":1,"offset":2612},"end":{"line":100,"column":19,"offset":2630},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"      类型：Number | Array；默认：0。图自适应画布时的四周留白像素值。fitView 为 true 时生效。","position":{"start":{"line":102,"column":1,"offset":2632},"end":{"line":102,"column":65,"offset":2696},"indent":[]}}],"position":{"start":{"line":102,"column":1,"offset":2632},"end":{"line":102,"column":65,"offset":2696},"indent":[]}},{"type":"heading","depth":4,"children":[{"type":"link","url":"#全局元素配置","title":null,"children":[],"data":{"hProperties":{"aria-label":"全局元素配置 permalink","class":"anchor"},"hChildren":[{"type":"raw","value":"<svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>"}]}},{"type":"text","value":"全局元素配置","position":{"start":{"line":104,"column":6,"offset":2703},"end":{"line":104,"column":12,"offset":2709},"indent":[]}}],"position":{"start":{"line":104,"column":1,"offset":2698},"end":{"line":104,"column":12,"offset":2709},"indent":[]},"data":{"id":"全局元素配置","htmlAttributes":{"id":"全局元素配置"},"hProperties":{"id":"全局元素配置"}}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">defaultNode</code>","position":{"start":{"line":106,"column":3,"offset":2713},"end":{"line":106,"column":16,"offset":2726},"indent":[]}}],"position":{"start":{"line":106,"column":3,"offset":2713},"end":{"line":106,"column":16,"offset":2726},"indent":[]}}],"position":{"start":{"line":106,"column":1,"offset":2711},"end":{"line":106,"column":16,"offset":2726},"indent":[]}}],"position":{"start":{"line":106,"column":1,"offset":2711},"end":{"line":106,"column":16,"offset":2726},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"      类型：Object。默认情况下全局节点的配置项，包括样式属性和其他属性。详见 ","position":{"start":{"line":108,"column":1,"offset":2728},"end":{"line":108,"column":46,"offset":2773},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/internal-node","children":[{"type":"text","value":"内置节点","position":{"start":{"line":108,"column":47,"offset":2774},"end":{"line":108,"column":51,"offset":2778},"indent":[]}}],"position":{"start":{"line":108,"column":46,"offset":2773},"end":{"line":108,"column":97,"offset":2824},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"。","position":{"start":{"line":108,"column":97,"offset":2824},"end":{"line":108,"column":98,"offset":2825},"indent":[]}}],"position":{"start":{"line":108,"column":1,"offset":2728},"end":{"line":108,"column":98,"offset":2825},"indent":[]}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">defaultEdge</code>","position":{"start":{"line":110,"column":3,"offset":2829},"end":{"line":110,"column":16,"offset":2842},"indent":[]}}],"position":{"start":{"line":110,"column":3,"offset":2829},"end":{"line":110,"column":16,"offset":2842},"indent":[]}}],"position":{"start":{"line":110,"column":1,"offset":2827},"end":{"line":110,"column":16,"offset":2842},"indent":[]}}],"position":{"start":{"line":110,"column":1,"offset":2827},"end":{"line":110,"column":16,"offset":2842},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"      类型：Object。默认情况下全局边的配置项，包括样式属性和其他属性。详见 ","position":{"start":{"line":112,"column":1,"offset":2844},"end":{"line":112,"column":45,"offset":2888},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/internal-edge","children":[{"type":"text","value":"内置边","position":{"start":{"line":112,"column":46,"offset":2889},"end":{"line":112,"column":49,"offset":2892},"indent":[]}}],"position":{"start":{"line":112,"column":45,"offset":2888},"end":{"line":112,"column":95,"offset":2938},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"。","position":{"start":{"line":112,"column":95,"offset":2938},"end":{"line":112,"column":96,"offset":2939},"indent":[]}}],"position":{"start":{"line":112,"column":1,"offset":2844},"end":{"line":112,"column":96,"offset":2939},"indent":[]}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">nodeStateStyles</code>","position":{"start":{"line":114,"column":3,"offset":2943},"end":{"line":114,"column":20,"offset":2960},"indent":[]}}],"position":{"start":{"line":114,"column":3,"offset":2943},"end":{"line":114,"column":20,"offset":2960},"indent":[]}}],"position":{"start":{"line":114,"column":1,"offset":2941},"end":{"line":114,"column":20,"offset":2960},"indent":[]}}],"position":{"start":{"line":114,"column":1,"offset":2941},"end":{"line":114,"column":20,"offset":2960},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"      类型：Object。除默认状态外的其他状态下节点的样式配置。详见 ","position":{"start":{"line":116,"column":1,"offset":2962},"end":{"line":116,"column":40,"offset":3001},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/fqnn9w","children":[{"type":"text","value":"状态 State","position":{"start":{"line":116,"column":41,"offset":3002},"end":{"line":116,"column":49,"offset":3010},"indent":[]}}],"position":{"start":{"line":116,"column":40,"offset":3001},"end":{"line":116,"column":88,"offset":3049},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"。","position":{"start":{"line":116,"column":88,"offset":3049},"end":{"line":116,"column":89,"offset":3050},"indent":[]}}],"position":{"start":{"line":116,"column":1,"offset":2962},"end":{"line":116,"column":89,"offset":3050},"indent":[]}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">edgeStateStyles</code>","position":{"start":{"line":118,"column":3,"offset":3054},"end":{"line":118,"column":20,"offset":3071},"indent":[]}}],"position":{"start":{"line":118,"column":3,"offset":3054},"end":{"line":118,"column":20,"offset":3071},"indent":[]}}],"position":{"start":{"line":118,"column":1,"offset":3052},"end":{"line":118,"column":20,"offset":3071},"indent":[]}}],"position":{"start":{"line":118,"column":1,"offset":3052},"end":{"line":118,"column":20,"offset":3071},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"      类型：Object。除默认状态外的其他状态下边的样式配置。详见 ","position":{"start":{"line":120,"column":1,"offset":3073},"end":{"line":120,"column":39,"offset":3111},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/fqnn9w","children":[{"type":"text","value":"状态 State","position":{"start":{"line":120,"column":40,"offset":3112},"end":{"line":120,"column":48,"offset":3120},"indent":[]}}],"position":{"start":{"line":120,"column":39,"offset":3111},"end":{"line":120,"column":87,"offset":3159},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"。","position":{"start":{"line":120,"column":87,"offset":3159},"end":{"line":120,"column":88,"offset":3160},"indent":[]}}],"position":{"start":{"line":120,"column":1,"offset":3073},"end":{"line":120,"column":88,"offset":3160},"indent":[]}},{"type":"heading","depth":4,"children":[{"type":"link","url":"#布局相关","title":null,"children":[],"data":{"hProperties":{"aria-label":"布局相关 permalink","class":"anchor"},"hChildren":[{"type":"raw","value":"<svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>"}]}},{"type":"text","value":"布局相关","position":{"start":{"line":122,"column":6,"offset":3167},"end":{"line":122,"column":10,"offset":3171},"indent":[]}}],"position":{"start":{"line":122,"column":1,"offset":3162},"end":{"line":122,"column":10,"offset":3171},"indent":[]},"data":{"id":"布局相关","htmlAttributes":{"id":"布局相关"},"hProperties":{"id":"布局相关"}}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">layout</code>","position":{"start":{"line":124,"column":3,"offset":3175},"end":{"line":124,"column":11,"offset":3183},"indent":[]}}],"position":{"start":{"line":124,"column":3,"offset":3175},"end":{"line":124,"column":11,"offset":3183},"indent":[]}}],"position":{"start":{"line":124,"column":1,"offset":3173},"end":{"line":124,"column":11,"offset":3183},"indent":[]}}],"position":{"start":{"line":124,"column":1,"offset":3173},"end":{"line":124,"column":11,"offset":3183},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"      类型：Object。若数据中不存在节点位置，则默认为随机布局。配置布局类型及其参数。详见 ","position":{"start":{"line":126,"column":1,"offset":3185},"end":{"line":126,"column":52,"offset":3236},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/qopkkg","children":[{"type":"text","value":"使用布局 Layout 教程","position":{"start":{"line":126,"column":53,"offset":3237},"end":{"line":126,"column":67,"offset":3251},"indent":[]}}],"position":{"start":{"line":126,"column":52,"offset":3236},"end":{"line":126,"column":106,"offset":3290},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"，","position":{"start":{"line":126,"column":106,"offset":3290},"end":{"line":126,"column":107,"offset":3291},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/agbmu2","children":[{"type":"text","value":"Layout API","position":{"start":{"line":126,"column":108,"offset":3292},"end":{"line":126,"column":118,"offset":3302},"indent":[]}}],"position":{"start":{"line":126,"column":107,"offset":3291},"end":{"line":126,"column":157,"offset":3341},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"。","position":{"start":{"line":126,"column":157,"offset":3341},"end":{"line":126,"column":158,"offset":3342},"indent":[]}}],"position":{"start":{"line":126,"column":1,"offset":3185},"end":{"line":126,"column":158,"offset":3342},"indent":[]}},{"type":"heading","depth":4,"children":[{"type":"link","url":"#交互行为相关","title":null,"children":[],"data":{"hProperties":{"aria-label":"交互行为相关 permalink","class":"anchor"},"hChildren":[{"type":"raw","value":"<svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>"}]}},{"type":"text","value":"交互行为相关","position":{"start":{"line":128,"column":6,"offset":3349},"end":{"line":128,"column":12,"offset":3355},"indent":[]}}],"position":{"start":{"line":128,"column":1,"offset":3344},"end":{"line":128,"column":12,"offset":3355},"indent":[]},"data":{"id":"交互行为相关","htmlAttributes":{"id":"交互行为相关"},"hProperties":{"id":"交互行为相关"}}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">modes</code>","position":{"start":{"line":130,"column":3,"offset":3359},"end":{"line":130,"column":10,"offset":3366},"indent":[]}}],"position":{"start":{"line":130,"column":3,"offset":3359},"end":{"line":130,"column":10,"offset":3366},"indent":[]}}],"position":{"start":{"line":130,"column":1,"offset":3357},"end":{"line":130,"column":10,"offset":3366},"indent":[]}}],"position":{"start":{"line":130,"column":1,"offset":3357},"end":{"line":130,"column":10,"offset":3366},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"      类型：Array。配置多种交互模式及其包含的交互事件的。详见 ","position":{"start":{"line":132,"column":1,"offset":3368},"end":{"line":132,"column":38,"offset":3405},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/g6-mode","children":[{"type":"text","value":"交互模式 Mode 教程","position":{"start":{"line":132,"column":39,"offset":3406},"end":{"line":132,"column":51,"offset":3418},"indent":[]}}],"position":{"start":{"line":132,"column":38,"offset":3405},"end":{"line":132,"column":91,"offset":3458},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"。","position":{"start":{"line":132,"column":91,"offset":3458},"end":{"line":132,"column":92,"offset":3459},"indent":[]}}],"position":{"start":{"line":132,"column":1,"offset":3368},"end":{"line":132,"column":92,"offset":3459},"indent":[]}},{"type":"heading","depth":4,"children":[{"type":"link","url":"#动画相关","title":null,"children":[],"data":{"hProperties":{"aria-label":"动画相关 permalink","class":"anchor"},"hChildren":[{"type":"raw","value":"<svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>"}]}},{"type":"text","value":"动画相关","position":{"start":{"line":134,"column":6,"offset":3466},"end":{"line":134,"column":10,"offset":3470},"indent":[]}}],"position":{"start":{"line":134,"column":1,"offset":3461},"end":{"line":134,"column":10,"offset":3470},"indent":[]},"data":{"id":"动画相关","htmlAttributes":{"id":"动画相关"},"hProperties":{"id":"动画相关"}}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">animate</code>","position":{"start":{"line":136,"column":3,"offset":3474},"end":{"line":136,"column":12,"offset":3483},"indent":[]}}],"position":{"start":{"line":136,"column":3,"offset":3474},"end":{"line":136,"column":12,"offset":3483},"indent":[]}}],"position":{"start":{"line":136,"column":1,"offset":3472},"end":{"line":136,"column":12,"offset":3483},"indent":[]}}],"position":{"start":{"line":136,"column":1,"offset":3472},"end":{"line":136,"column":12,"offset":3483},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"      类型：Boolean；默认：'false'。是否启用全局动画。启用后，布局变化时将会以动画形式变换节点位置。","position":{"start":{"line":138,"column":1,"offset":3485},"end":{"line":138,"column":61,"offset":3545},"indent":[]}}],"position":{"start":{"line":138,"column":1,"offset":3485},"end":{"line":138,"column":61,"offset":3545},"indent":[]}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">animateCfg</code>","position":{"start":{"line":140,"column":3,"offset":3549},"end":{"line":140,"column":15,"offset":3561},"indent":[]}}],"position":{"start":{"line":140,"column":3,"offset":3549},"end":{"line":140,"column":15,"offset":3561},"indent":[]}}],"position":{"start":{"line":140,"column":1,"offset":3547},"end":{"line":140,"column":15,"offset":3561},"indent":[]}}],"position":{"start":{"line":140,"column":1,"offset":3547},"end":{"line":140,"column":15,"offset":3561},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"      类型：Object。全局动画的配置项，包括动画效果、动画时长等。详见 【TODO】。","position":{"start":{"line":142,"column":1,"offset":3563},"end":{"line":142,"column":49,"offset":3611},"indent":[]}}],"position":{"start":{"line":142,"column":1,"offset":3563},"end":{"line":142,"column":49,"offset":3611},"indent":[]}},{"type":"heading","depth":4,"children":[{"type":"link","url":"#插件","title":null,"children":[],"data":{"hProperties":{"aria-label":"插件 permalink","class":"anchor"},"hChildren":[{"type":"raw","value":"<svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>"}]}},{"type":"text","value":"插件","position":{"start":{"line":144,"column":6,"offset":3618},"end":{"line":144,"column":8,"offset":3620},"indent":[]}}],"position":{"start":{"line":144,"column":1,"offset":3613},"end":{"line":144,"column":8,"offset":3620},"indent":[]},"data":{"id":"插件","htmlAttributes":{"id":"插件"},"hProperties":{"id":"插件"}}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">plugins</code>","position":{"start":{"line":146,"column":3,"offset":3624},"end":{"line":146,"column":12,"offset":3633},"indent":[]}}],"position":{"start":{"line":146,"column":3,"offset":3624},"end":{"line":146,"column":12,"offset":3633},"indent":[]}}],"position":{"start":{"line":146,"column":1,"offset":3622},"end":{"line":146,"column":12,"offset":3633},"indent":[]}}],"position":{"start":{"line":146,"column":1,"offset":3622},"end":{"line":146,"column":12,"offset":3633},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"      类型：Array。配置辅助插件。详见 ","position":{"start":{"line":148,"column":1,"offset":3635},"end":{"line":148,"column":26,"offset":3660},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/plugin","children":[{"type":"text","value":"Plugin API","position":{"start":{"line":148,"column":27,"offset":3661},"end":{"line":148,"column":37,"offset":3671},"indent":[]}}],"position":{"start":{"line":148,"column":26,"offset":3660},"end":{"line":148,"column":76,"offset":3710},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"。","position":{"start":{"line":148,"column":76,"offset":3710},"end":{"line":148,"column":77,"offset":3711},"indent":[]}}],"position":{"start":{"line":148,"column":1,"offset":3635},"end":{"line":148,"column":77,"offset":3711},"indent":[]}},{"type":"heading","depth":2,"children":[{"type":"link","url":"#常用函数","title":null,"children":[],"data":{"hProperties":{"aria-label":"常用函数 permalink","class":"anchor"},"hChildren":[{"type":"raw","value":"<svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>"}]}},{"type":"text","value":"常用函数","position":{"start":{"line":150,"column":4,"offset":3716},"end":{"line":150,"column":8,"offset":3720},"indent":[]}}],"position":{"start":{"line":150,"column":1,"offset":3713},"end":{"line":150,"column":8,"offset":3720},"indent":[]},"data":{"id":"常用函数","htmlAttributes":{"id":"常用函数"},"hProperties":{"id":"常用函数"}}},{"type":"paragraph","children":[{"type":"text","value":"在 ","position":{"start":{"line":151,"column":1,"offset":3721},"end":{"line":151,"column":3,"offset":3723},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/ie7zi7#cRVfC","children":[{"type":"text","value":"前提代码","position":{"start":{"line":151,"column":4,"offset":3724},"end":{"line":151,"column":8,"offset":3728},"indent":[]}}],"position":{"start":{"line":151,"column":3,"offset":3723},"end":{"line":151,"column":53,"offset":3773},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":" 中使用了两个必要的函数：","position":{"start":{"line":151,"column":53,"offset":3773},"end":{"line":151,"column":66,"offset":3786},"indent":[]}}],"position":{"start":{"line":151,"column":1,"offset":3721},"end":{"line":151,"column":66,"offset":3786},"indent":[]}},{"type":"html","lang":"javascript","meta":null,"value":"<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\"><span class=\"token comment\">// 读取数据</span>\ngraph<span class=\"token punctuation\">.</span><span class=\"token function\">data</span><span class=\"token punctuation\">(</span>data<span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n<span class=\"token comment\">// 渲染图</span>\ngraph<span class=\"token punctuation\">.</span><span class=\"token function\">render</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>","position":{"start":{"line":152,"column":1,"offset":3787},"end":{"line":157,"column":4,"offset":3853},"indent":[1,1,1,1,1]}},{"type":"list","ordered":false,"start":null,"spread":false,"children":[{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">data(data)</code>","position":{"start":{"line":159,"column":3,"offset":3857},"end":{"line":159,"column":15,"offset":3869},"indent":[]}},{"type":"text","value":"：读取数据源 ","position":{"start":{"line":159,"column":15,"offset":3869},"end":{"line":159,"column":22,"offset":3876},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">data</code>","position":{"start":{"line":159,"column":22,"offset":3876},"end":{"line":159,"column":28,"offset":3882},"indent":[]}},{"type":"text","value":" 到图实例 ","position":{"start":{"line":159,"column":28,"offset":3882},"end":{"line":159,"column":34,"offset":3888},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">graph</code>","position":{"start":{"line":159,"column":34,"offset":3888},"end":{"line":159,"column":41,"offset":3895},"indent":[]}},{"type":"text","value":" 中。","position":{"start":{"line":159,"column":41,"offset":3895},"end":{"line":159,"column":44,"offset":3898},"indent":[]}}],"position":{"start":{"line":159,"column":3,"offset":3857},"end":{"line":159,"column":44,"offset":3898},"indent":[]}}],"position":{"start":{"line":159,"column":1,"offset":3855},"end":{"line":159,"column":44,"offset":3898},"indent":[]}},{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"text","value":"render()：渲染图。","position":{"start":{"line":160,"column":3,"offset":3901},"end":{"line":160,"column":16,"offset":3914},"indent":[]}}],"position":{"start":{"line":160,"column":3,"offset":3901},"end":{"line":160,"column":16,"offset":3914},"indent":[]}}],"position":{"start":{"line":160,"column":1,"offset":3899},"end":{"line":160,"column":16,"offset":3914},"indent":[]}}],"position":{"start":{"line":159,"column":1,"offset":3855},"end":{"line":160,"column":16,"offset":3914},"indent":[1]}},{"type":"paragraph","children":[{"type":"text","value":"Graph 的完整函数参见 ","position":{"start":{"line":162,"column":1,"offset":3916},"end":{"line":162,"column":15,"offset":3930},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/graph#wbgjF","children":[{"type":"text","value":"Graph API","position":{"start":{"line":162,"column":16,"offset":3931},"end":{"line":162,"column":25,"offset":3940},"indent":[]}}],"position":{"start":{"line":162,"column":15,"offset":3930},"end":{"line":162,"column":69,"offset":3984},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"。","position":{"start":{"line":162,"column":69,"offset":3984},"end":{"line":162,"column":70,"offset":3985},"indent":[]}}],"position":{"start":{"line":162,"column":1,"offset":3916},"end":{"line":162,"column":70,"offset":3985},"indent":[]}}],"position":{"start":{"line":1,"column":1,"offset":0},"end":{"line":163,"column":1,"offset":3986}}}}