UNPKG

@antv/g6

Version:

graph visualization frame work

1 lines 49.9 kB
{"expireTime":9007200828528711000,"key":"transformer-remark-markdown-ast-f143123bf65084c4d30d46d70d094472-gatsby-remark-prettiergatsby-remark-prismjsgatsby-remark-external-linksgatsby-remark-autolink-headersgatsby-remark-reading-time-","val":{"type":"root","children":[{"type":"paragraph","children":[{"type":"text","value":"G6 内置了折线 loop 边,其默认样式如下。","position":{"start":{"line":2,"column":1,"offset":1},"end":{"line":2,"column":25,"offset":25},"indent":[]}},{"type":"html","value":"<br />","position":{"start":{"line":2,"column":25,"offset":25},"end":{"line":2,"column":31,"offset":31},"indent":[]}},{"type":"text","value":"\n","position":{"start":{"line":2,"column":31,"offset":31},"end":{"line":3,"column":1,"offset":32},"indent":[1]}},{"type":"image","title":null,"url":"https://cdn.nlark.com/yuque/0/2019/png/156681/1570875933229-5bd7e62a-b4f5-487c-9ee9-3a7df1d6e220.png#align=left&display=inline&height=60&name=image.png&originHeight=120&originWidth=114&search=&size=6588&status=done&width=57","alt":"image.png","position":{"start":{"line":3,"column":1,"offset":32},"end":{"line":3,"column":238,"offset":269},"indent":[]}}],"position":{"start":{"line":2,"column":1,"offset":1},"end":{"line":3,"column":238,"offset":269},"indent":[1]}},{"type":"paragraph","children":[{"type":"text","value":" 注意 ","position":{"start":{"line":5,"column":1,"offset":271},"end":{"line":5,"column":5,"offset":275},"indent":[]}},{"type":"html","value":"<br />","position":{"start":{"line":5,"column":5,"offset":275},"end":{"line":5,"column":11,"offset":281},"indent":[]}},{"type":"text","value":"loop 边适用于自环边,即起始点与结束点为相同节点的边,在不同端点的边上适用 loop 边将会出现异常效果。\n","position":{"start":{"line":5,"column":11,"offset":281},"end":{"line":6,"column":1,"offset":337},"indent":[1]}},{"type":"html","value":"<br />","position":{"start":{"line":6,"column":1,"offset":337},"end":{"line":6,"column":7,"offset":343},"indent":[]}},{"type":"text","value":"\n","position":{"start":{"line":6,"column":7,"offset":343},"end":{"line":7,"column":1,"offset":344},"indent":[1]}},{"type":"html","value":"<img src='https://cdn.nlark.com/yuque/0/2019/png/156681/1570777918386-5b4789f6-4287-4e33-bb59-a671d5cb008d.png#align=left&display=inline&height=176&name=image.png&originHeight=602&originWidth=256&search=&size=37135&status=done&width=75' width='75' height='176' />","position":{"start":{"line":7,"column":1,"offset":344},"end":{"line":7,"column":264,"offset":607},"indent":[]}}],"position":{"start":{"line":5,"column":1,"offset":271},"end":{"line":7,"column":264,"offset":607},"indent":[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":9,"column":4,"offset":612},"end":{"line":9,"column":8,"offset":616},"indent":[]}}],"position":{"start":{"line":9,"column":1,"offset":609},"end":{"line":9,"column":8,"offset":616},"indent":[]},"data":{"id":"使用方法","htmlAttributes":{"id":"使用方法"},"hProperties":{"id":"使用方法"}}},{"type":"paragraph","children":[{"type":"text","value":"如 ","position":{"start":{"line":10,"column":1,"offset":617},"end":{"line":10,"column":3,"offset":619},"indent":[]}},{"type":"link","title":null,"url":"../defaultEdge","children":[{"type":"text","value":"内置边","position":{"start":{"line":10,"column":4,"offset":620},"end":{"line":10,"column":7,"offset":623},"indent":[]}}],"position":{"start":{"line":10,"column":3,"offset":619},"end":{"line":10,"column":24,"offset":640},"indent":[]}},{"type":"text","value":" 一节所示,配置边的方式有两种:实例化图时全局配置,在数据中动态配置。","position":{"start":{"line":10,"column":24,"offset":640},"end":{"line":10,"column":59,"offset":675},"indent":[]}}],"position":{"start":{"line":10,"column":1,"offset":617},"end":{"line":10,"column":59,"offset":675},"indent":[]}},{"type":"heading","depth":3,"children":[{"type":"link","url":"#1-实例化图时全局配置","title":null,"children":[],"data":{"hProperties":{"aria-label":"1 实例化图时全局配置 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":"1 实例化图时全局配置","position":{"start":{"line":13,"column":5,"offset":682},"end":{"line":13,"column":16,"offset":693},"indent":[]}}],"position":{"start":{"line":13,"column":1,"offset":678},"end":{"line":13,"column":16,"offset":693},"indent":[]},"data":{"id":"1-实例化图时全局配置","htmlAttributes":{"id":"1-实例化图时全局配置"},"hProperties":{"id":"1-实例化图时全局配置"}}},{"type":"paragraph","children":[{"type":"text","value":"用户在实例化 Graph 时候可以通过 ","position":{"start":{"line":14,"column":1,"offset":694},"end":{"line":14,"column":21,"offset":714},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">defaultEdge</code>","position":{"start":{"line":14,"column":21,"offset":714},"end":{"line":14,"column":34,"offset":727},"indent":[]}},{"type":"text","value":" 指定 ","position":{"start":{"line":14,"column":34,"offset":727},"end":{"line":14,"column":38,"offset":731},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">shape</code>","position":{"start":{"line":14,"column":38,"offset":731},"end":{"line":14,"column":45,"offset":738},"indent":[]}},{"type":"text","value":" 为 ","position":{"start":{"line":14,"column":45,"offset":738},"end":{"line":14,"column":48,"offset":741},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">&#39;loop&#39;</code>","position":{"start":{"line":14,"column":48,"offset":741},"end":{"line":14,"column":56,"offset":749},"indent":[]}},{"type":"text","value":",即可使用 ","position":{"start":{"line":14,"column":56,"offset":749},"end":{"line":14,"column":62,"offset":755},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">loop</code>","position":{"start":{"line":14,"column":62,"offset":755},"end":{"line":14,"column":68,"offset":761},"indent":[]}},{"type":"text","value":" 边。需要注意的是,如果图上存在非自环边,loop 将会表现异常。因此不建议在存在非自环边的图上使用此全局配置方法。","position":{"start":{"line":14,"column":68,"offset":761},"end":{"line":14,"column":126,"offset":819},"indent":[]}}],"position":{"start":{"line":14,"column":1,"offset":694},"end":{"line":14,"column":126,"offset":819},"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>\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\">600</span><span class=\"token punctuation\">,</span>\n defaultEdge<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">{</span>\n shape<span class=\"token punctuation\">:</span> <span class=\"token string\">'loop'</span><span class=\"token punctuation\">,</span>\n <span class=\"token comment\">// 其他配置</span>\n <span class=\"token punctuation\">}</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":15,"column":1,"offset":820},"end":{"line":25,"column":4,"offset":976},"indent":[1,1,1,1,1,1,1,1,1,1]}},{"type":"heading","depth":3,"children":[{"type":"link","url":"#2-在数据中动态配置","title":null,"children":[],"data":{"hProperties":{"aria-label":"2 在数据中动态配置 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":"2 在数据中动态配置","position":{"start":{"line":28,"column":5,"offset":983},"end":{"line":28,"column":15,"offset":993},"indent":[]}}],"position":{"start":{"line":28,"column":1,"offset":979},"end":{"line":28,"column":15,"offset":993},"indent":[]},"data":{"id":"2-在数据中动态配置","htmlAttributes":{"id":"2-在数据中动态配置"},"hProperties":{"id":"2-在数据中动态配置"}}},{"type":"paragraph","children":[{"type":"text","value":"如果需要使不同节点有不同的配置,可以将配置写入到节点数据中。这种配置方式可以通过下面代码的形式直接写入数据,也可以通过遍历数据的方式写入。","position":{"start":{"line":29,"column":1,"offset":994},"end":{"line":29,"column":70,"offset":1063},"indent":[]}}],"position":{"start":{"line":29,"column":1,"offset":994},"end":{"line":29,"column":70,"offset":1063},"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> data <span class=\"token operator\">=</span> <span class=\"token punctuation\">{</span>\n nodes<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">[</span>\n <span class=\"token operator\">...</span> <span class=\"token comment\">// 节点</span>\n <span class=\"token punctuation\">]</span><span class=\"token punctuation\">,</span>\n edges<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">[</span><span class=\"token punctuation\">{</span>\n source<span class=\"token punctuation\">:</span> <span class=\"token string\">'node0'</span><span class=\"token punctuation\">,</span>\n target<span class=\"token punctuation\">:</span> <span class=\"token string\">'node0'</span>\n shape<span class=\"token punctuation\">:</span> <span class=\"token string\">'loop'</span><span class=\"token punctuation\">,</span>\n <span class=\"token operator\">...</span> <span class=\"token comment\">// 其他配置</span>\n style<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">{</span>\n <span class=\"token operator\">...</span> <span class=\"token comment\">// 样式属性,每种边的详细样式属性参见各边文档</span>\n <span class=\"token punctuation\">}</span>\n <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n <span class=\"token operator\">...</span> <span class=\"token comment\">// 其他边</span>\n <span class=\"token punctuation\">]</span>\n<span class=\"token punctuation\">}</span></code></pre></div>","position":{"start":{"line":30,"column":1,"offset":1064},"end":{"line":47,"column":4,"offset":1295},"indent":[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":50,"column":4,"offset":1301},"end":{"line":50,"column":9,"offset":1306},"indent":[]}}],"position":{"start":{"line":50,"column":1,"offset":1298},"end":{"line":50,"column":9,"offset":1306},"indent":[]},"data":{"id":"配置项说明","htmlAttributes":{"id":"配置项说明"},"hProperties":{"id":"配置项说明"}}},{"type":"paragraph","children":[{"type":"text","value":"自环是指连接单个节点自身的边,是一种边的特殊情况,因此,在通用属性基础上,支持了特殊的配置 ","position":{"start":{"line":51,"column":1,"offset":1307},"end":{"line":51,"column":47,"offset":1353},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">loopCfg</code>","position":{"start":{"line":51,"column":47,"offset":1353},"end":{"line":51,"column":56,"offset":1362},"indent":[]}},{"type":"text","value":"。","position":{"start":{"line":51,"column":56,"offset":1362},"end":{"line":51,"column":57,"offset":1363},"indent":[]}}],"position":{"start":{"line":51,"column":1,"offset":1307},"end":{"line":51,"column":57,"offset":1363},"indent":[]}},{"type":"paragraph","children":[{"type":"text","value":"loop 边支持以下的配置项,对于 Object 类型的配置项将在后面有详细讲解:","position":{"start":{"line":53,"column":1,"offset":1365},"end":{"line":53,"column":42,"offset":1406},"indent":[]}}],"position":{"start":{"line":53,"column":1,"offset":1365},"end":{"line":53,"column":42,"offset":1406},"indent":[]}},{"type":"table","align":[null,null,null,null],"children":[{"type":"tableRow","children":[{"type":"tableCell","children":[{"type":"text","value":"名称","position":{"start":{"line":55,"column":3,"offset":1410},"end":{"line":55,"column":5,"offset":1412},"indent":[]}}],"position":{"start":{"line":55,"column":3,"offset":1410},"end":{"line":55,"column":5,"offset":1412},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"含义","position":{"start":{"line":55,"column":8,"offset":1415},"end":{"line":55,"column":10,"offset":1417},"indent":[]}}],"position":{"start":{"line":55,"column":8,"offset":1415},"end":{"line":55,"column":10,"offset":1417},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"类型","position":{"start":{"line":55,"column":13,"offset":1420},"end":{"line":55,"column":15,"offset":1422},"indent":[]}}],"position":{"start":{"line":55,"column":13,"offset":1420},"end":{"line":55,"column":15,"offset":1422},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"备注","position":{"start":{"line":55,"column":18,"offset":1425},"end":{"line":55,"column":20,"offset":1427},"indent":[]}}],"position":{"start":{"line":55,"column":18,"offset":1425},"end":{"line":55,"column":20,"offset":1427},"indent":[]}}],"position":{"start":{"line":55,"column":1,"offset":1408},"end":{"line":55,"column":22,"offset":1429},"indent":[]}},{"type":"tableRow","children":[{"type":"tableCell","children":[{"type":"text","value":"color","position":{"start":{"line":57,"column":3,"offset":1458},"end":{"line":57,"column":8,"offset":1463},"indent":[]}}],"position":{"start":{"line":57,"column":3,"offset":1458},"end":{"line":57,"column":8,"offset":1463},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"边的颜色","position":{"start":{"line":57,"column":11,"offset":1466},"end":{"line":57,"column":15,"offset":1470},"indent":[]}}],"position":{"start":{"line":57,"column":11,"offset":1466},"end":{"line":57,"column":15,"offset":1470},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"String","position":{"start":{"line":57,"column":18,"offset":1473},"end":{"line":57,"column":24,"offset":1479},"indent":[]}}],"position":{"start":{"line":57,"column":18,"offset":1473},"end":{"line":57,"column":24,"offset":1479},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"优先级低于 style 中的 stroke","position":{"start":{"line":57,"column":27,"offset":1482},"end":{"line":57,"column":48,"offset":1503},"indent":[]}}],"position":{"start":{"line":57,"column":27,"offset":1482},"end":{"line":57,"column":48,"offset":1503},"indent":[]}}],"position":{"start":{"line":57,"column":1,"offset":1456},"end":{"line":57,"column":50,"offset":1505},"indent":[]}},{"type":"tableRow","children":[{"type":"tableCell","children":[{"type":"text","value":"style","position":{"start":{"line":58,"column":3,"offset":1508},"end":{"line":58,"column":8,"offset":1513},"indent":[]}}],"position":{"start":{"line":58,"column":3,"offset":1508},"end":{"line":58,"column":8,"offset":1513},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"边的样式","position":{"start":{"line":58,"column":11,"offset":1516},"end":{"line":58,"column":15,"offset":1520},"indent":[]}}],"position":{"start":{"line":58,"column":11,"offset":1516},"end":{"line":58,"column":15,"offset":1520},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"Object","position":{"start":{"line":58,"column":18,"offset":1523},"end":{"line":58,"column":24,"offset":1529},"indent":[]}}],"position":{"start":{"line":58,"column":18,"offset":1523},"end":{"line":58,"column":24,"offset":1529},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"Canvas支持的属性","position":{"start":{"line":58,"column":27,"offset":1532},"end":{"line":58,"column":38,"offset":1543},"indent":[]}}],"position":{"start":{"line":58,"column":27,"offset":1532},"end":{"line":58,"column":38,"offset":1543},"indent":[]}}],"position":{"start":{"line":58,"column":1,"offset":1506},"end":{"line":58,"column":40,"offset":1545},"indent":[]}},{"type":"tableRow","children":[{"type":"tableCell","children":[{"type":"text","value":"style.endArrow","position":{"start":{"line":59,"column":3,"offset":1548},"end":{"line":59,"column":17,"offset":1562},"indent":[]}}],"position":{"start":{"line":59,"column":3,"offset":1548},"end":{"line":59,"column":17,"offset":1562},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"边结束端是否有箭头","position":{"start":{"line":59,"column":20,"offset":1565},"end":{"line":59,"column":29,"offset":1574},"indent":[]}}],"position":{"start":{"line":59,"column":20,"offset":1565},"end":{"line":59,"column":29,"offset":1574},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"Boolean","position":{"start":{"line":59,"column":32,"offset":1577},"end":{"line":59,"column":39,"offset":1584},"indent":[]}}],"position":{"start":{"line":59,"column":32,"offset":1577},"end":{"line":59,"column":39,"offset":1584},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"默认为 false","position":{"start":{"line":59,"column":42,"offset":1587},"end":{"line":59,"column":51,"offset":1596},"indent":[]}}],"position":{"start":{"line":59,"column":42,"offset":1587},"end":{"line":59,"column":51,"offset":1596},"indent":[]}}],"position":{"start":{"line":59,"column":1,"offset":1546},"end":{"line":59,"column":53,"offset":1598},"indent":[]}},{"type":"tableRow","children":[{"type":"tableCell","children":[{"type":"text","value":"label","position":{"start":{"line":60,"column":3,"offset":1601},"end":{"line":60,"column":8,"offset":1606},"indent":[]}}],"position":{"start":{"line":60,"column":3,"offset":1601},"end":{"line":60,"column":8,"offset":1606},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"标签文本文字","position":{"start":{"line":60,"column":11,"offset":1609},"end":{"line":60,"column":17,"offset":1615},"indent":[]}}],"position":{"start":{"line":60,"column":11,"offset":1609},"end":{"line":60,"column":17,"offset":1615},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"String","position":{"start":{"line":60,"column":20,"offset":1618},"end":{"line":60,"column":26,"offset":1624},"indent":[]}}],"position":{"start":{"line":60,"column":20,"offset":1618},"end":{"line":60,"column":26,"offset":1624},"indent":[]}},{"type":"tableCell","children":[],"position":{"start":{"line":60,"column":30,"offset":1628},"end":{"line":60,"column":30,"offset":1628},"indent":[]}}],"position":{"start":{"line":60,"column":1,"offset":1599},"end":{"line":60,"column":31,"offset":1629},"indent":[]}},{"type":"tableRow","children":[{"type":"tableCell","children":[{"type":"text","value":"labelCfg","position":{"start":{"line":61,"column":3,"offset":1632},"end":{"line":61,"column":11,"offset":1640},"indent":[]}}],"position":{"start":{"line":61,"column":3,"offset":1632},"end":{"line":61,"column":11,"offset":1640},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"文件配置项","position":{"start":{"line":61,"column":14,"offset":1643},"end":{"line":61,"column":19,"offset":1648},"indent":[]}}],"position":{"start":{"line":61,"column":14,"offset":1643},"end":{"line":61,"column":19,"offset":1648},"indent":[]}},{"type":"tableCell","children":[{"type":"text","value":"Object","position":{"start":{"line":61,"column":22,"offset":1651},"end":{"line":61,"column":28,"offset":1657},"indent":[]}}],"position":{"start":{"line":61,"column":22,"offset":1651},"end":{"line":61,"column":28,"offset":1657},"indent":[]}},{"type":"tableCell","children":[],"position":{"start":{"line":61,"column":32,"offset":1661},"end":{"line":61,"column":32,"offset":1661},"indent":[]}}],"position":{"start":{"line":61,"column":1,"offset":1630},"end":{"line":61,"column":33,"offset":1662},"indent":[]}},{"type":"tableRow","children":[{"type":"tableCell","children":[{"type":"strong","children":[{"type":"text","value":"loopCfg","position":{"start":{"line":62,"column":5,"offset":1667},"end":{"line":62,"column":12,"offset":1674},"indent":[]}}],"position":{"start":{"line":62,"column":3,"offset":1665},"end":{"line":62,"column":14,"offset":1676},"indent":[]}}],"position":{"start":{"line":62,"column":3,"offset":1665},"end":{"line":62,"column":14,"offset":1676},"indent":[]}},{"type":"tableCell","children":[{"type":"strong","children":[{"type":"text","value":"自环特殊配置","position":{"start":{"line":62,"column":19,"offset":1681},"end":{"line":62,"column":25,"offset":1687},"indent":[]}}],"position":{"start":{"line":62,"column":17,"offset":1679},"end":{"line":62,"column":27,"offset":1689},"indent":[]}}],"position":{"start":{"line":62,"column":17,"offset":1679},"end":{"line":62,"column":27,"offset":1689},"indent":[]}},{"type":"tableCell","children":[{"type":"strong","children":[{"type":"text","value":"Object","position":{"start":{"line":62,"column":32,"offset":1694},"end":{"line":62,"column":38,"offset":1700},"indent":[]}}],"position":{"start":{"line":62,"column":30,"offset":1692},"end":{"line":62,"column":40,"offset":1702},"indent":[]}}],"position":{"start":{"line":62,"column":30,"offset":1692},"end":{"line":62,"column":40,"offset":1702},"indent":[]}},{"type":"tableCell","children":[],"position":{"start":{"line":62,"column":44,"offset":1706},"end":{"line":62,"column":44,"offset":1706},"indent":[]}}],"position":{"start":{"line":62,"column":1,"offset":1663},"end":{"line":62,"column":45,"offset":1707},"indent":[]}}],"position":{"start":{"line":55,"column":1,"offset":1408},"end":{"line":62,"column":45,"offset":1707},"indent":[1,1,1,1,1,1,1]}},{"type":"heading","depth":3,"children":[{"type":"link","url":"#样式属性-style","title":null,"children":[],"data":{"hProperties":{"aria-label":"样式属性 style 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":"样式属性 style","position":{"start":{"line":66,"column":5,"offset":1715},"end":{"line":66,"column":15,"offset":1725},"indent":[]}}],"position":{"start":{"line":66,"column":1,"offset":1711},"end":{"line":66,"column":15,"offset":1725},"indent":[]},"data":{"id":"样式属性-style","htmlAttributes":{"id":"样式属性-style"},"hProperties":{"id":"样式属性-style"}}},{"type":"paragraph","children":[{"type":"text","value":"Object 类型。配置项与边的通用样式属性相同,见 ","position":{"start":{"line":67,"column":1,"offset":1726},"end":{"line":67,"column":28,"offset":1753},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/internal-edge","children":[{"type":"text","value":"内置边","position":{"start":{"line":67,"column":29,"offset":1754},"end":{"line":67,"column":32,"offset":1757},"indent":[]}}],"position":{"start":{"line":67,"column":28,"offset":1753},"end":{"line":67,"column":78,"offset":1803},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"。下面代码演示在实例化图时全局配置方法中配置 ","position":{"start":{"line":67,"column":78,"offset":1803},"end":{"line":67,"column":101,"offset":1826},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">style</code>","position":{"start":{"line":67,"column":101,"offset":1826},"end":{"line":67,"column":108,"offset":1833},"indent":[]}},{"type":"text","value":",以达到下图效果。","position":{"start":{"line":67,"column":108,"offset":1833},"end":{"line":67,"column":117,"offset":1842},"indent":[]}},{"type":"html","value":"<br />","position":{"start":{"line":67,"column":117,"offset":1842},"end":{"line":67,"column":123,"offset":1848},"indent":[]}},{"type":"image","title":null,"url":"https://cdn.nlark.com/yuque/0/2019/png/156681/1570875958411-aa33e3e9-1eee-4061-873e-a677b7dd495a.png#align=left&display=inline&height=57&name=image.png&originHeight=114&originWidth=88&search=&size=8617&status=done&width=44","alt":"image.png","position":{"start":{"line":67,"column":123,"offset":1848},"end":{"line":67,"column":359,"offset":2084},"indent":[]}}],"position":{"start":{"line":67,"column":1,"offset":1726},"end":{"line":67,"column":359,"offset":2084},"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> data <span class=\"token operator\">=</span> <span class=\"token punctuation\">{</span>\n nodes<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">[</span>\n <span class=\"token punctuation\">{</span>\n id<span class=\"token punctuation\">:</span> <span class=\"token string\">'node0'</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\">100</span><span class=\"token punctuation\">,</span>\n size<span class=\"token punctuation\">:</span> <span class=\"token number\">20</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">]</span><span class=\"token punctuation\">,</span>\n edges<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">[</span>\n <span class=\"token punctuation\">{</span>\n source<span class=\"token punctuation\">:</span> <span class=\"token string\">'node0'</span><span class=\"token punctuation\">,</span>\n target<span class=\"token punctuation\">:</span> <span class=\"token string\">'node0'</span><span class=\"token punctuation\">,</span>\n shape<span class=\"token punctuation\">:</span> <span class=\"token string\">'loop'</span><span class=\"token punctuation\">,</span>\n label<span class=\"token punctuation\">:</span> <span class=\"token string\">'loop'</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">]</span><span class=\"token punctuation\">,</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</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>\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\">600</span><span class=\"token punctuation\">,</span>\n defaultEdge<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">{</span>\n <span class=\"token comment\">// shape: 'loop', // 在数据中已经指定 shape,这里无需再次指定</span>\n style<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">{</span>\n endArrow<span class=\"token punctuation\">:</span> <span class=\"token boolean\">true</span><span class=\"token punctuation\">,</span>\n stroke<span class=\"token punctuation\">:</span> <span class=\"token string\">'#088'</span><span class=\"token punctuation\">,</span>\n lineWidth<span class=\"token punctuation\">:</span> <span class=\"token number\">3</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</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>\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":68,"column":1,"offset":2085},"end":{"line":99,"column":4,"offset":2556},"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]}},{"type":"heading","depth":3,"children":[{"type":"link","url":"#标签文本配置-labelcfg","title":null,"children":[],"data":{"hProperties":{"aria-label":"标签文本配置 labelcfg 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":"标签文本配置 labelCfg","position":{"start":{"line":102,"column":5,"offset":2563},"end":{"line":102,"column":20,"offset":2578},"indent":[]}}],"position":{"start":{"line":102,"column":1,"offset":2559},"end":{"line":102,"column":20,"offset":2578},"indent":[]},"data":{"id":"标签文本配置-labelcfg","htmlAttributes":{"id":"标签文本配置-labelcfg"},"hProperties":{"id":"标签文本配置-labelcfg"}}},{"type":"paragraph","children":[{"type":"text","value":"Object 类型。其配置与边的通用文本配置相同,见 ","position":{"start":{"line":103,"column":1,"offset":2579},"end":{"line":103,"column":28,"offset":2606},"indent":[]}},{"type":"link","title":null,"url":"https://www.yuque.com/antv/g6/internal-edge","children":[{"type":"text","value":"内置边","position":{"start":{"line":103,"column":29,"offset":2607},"end":{"line":103,"column":32,"offset":2610},"indent":[]}}],"position":{"start":{"line":103,"column":28,"offset":2606},"end":{"line":103,"column":78,"offset":2656},"indent":[]},"data":{"hProperties":{"target":"_self","rel":"nofollow"}}},{"type":"text","value":"。基于上面 ","position":{"start":{"line":103,"column":78,"offset":2656},"end":{"line":103,"column":84,"offset":2662},"indent":[]}},{"type":"link","title":null,"url":"#XQFb2","children":[{"type":"text","value":"样式属性 style","position":{"start":{"line":103,"column":85,"offset":2663},"end":{"line":103,"column":95,"offset":2673},"indent":[]}}],"position":{"start":{"line":103,"column":84,"offset":2662},"end":{"line":103,"column":104,"offset":2682},"indent":[]}},{"type":"text","value":" 中的代码,下面代码在 ","position":{"start":{"line":103,"column":104,"offset":2682},"end":{"line":103,"column":116,"offset":2694},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">defaultNode</code>","position":{"start":{"line":103,"column":116,"offset":2694},"end":{"line":103,"column":129,"offset":2707},"indent":[]}},{"type":"text","value":" 中增加了 ","position":{"start":{"line":103,"column":129,"offset":2707},"end":{"line":103,"column":135,"offset":2713},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">labelCfg</code>","position":{"start":{"line":103,"column":135,"offset":2713},"end":{"line":103,"column":145,"offset":2723},"indent":[]}},{"type":"text","value":" 配置项进行文本的配置,使之达到如下图效果。","position":{"start":{"line":103,"column":145,"offset":2723},"end":{"line":103,"column":167,"offset":2745},"indent":[]}},{"type":"html","value":"<br />","position":{"start":{"line":103,"column":167,"offset":2745},"end":{"line":103,"column":173,"offset":2751},"indent":[]}},{"type":"image","title":null,"url":"https://cdn.nlark.com/yuque/0/2019/png/156681/1570878002730-b0e471d7-1273-425b-8cc3-0b6ba3f91b06.png#align=left&display=inline&height=51&name=image.png&originHeight=102&originWidth=120&search=&size=9700&status=done&width=60","alt":"image.png","position":{"start":{"line":103,"column":173,"offset":2751},"end":{"line":103,"column":410,"offset":2988},"indent":[]}}],"position":{"start":{"line":103,"column":1,"offset":2579},"end":{"line":103,"column":410,"offset":2988},"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> data <span class=\"token operator\">=</span> <span class=\"token punctuation\">{</span>\n <span class=\"token comment\">// ... data 内容</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</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 <span class=\"token comment\">// ... 图的其他配置</span>\n defaultEdge<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">{</span>\n <span class=\"token comment\">// ... 其他配置</span>\n labelCfg<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">{</span>\n refY<span class=\"token punctuation\">:</span> <span class=\"token operator\">-</span><span class=\"token number\">5</span><span class=\"token punctuation\">,</span>\n refX<span class=\"token punctuation\">:</span> <span class=\"token number\">30</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n<span class=\"token comment\">// ...</span>\n</code></pre></div>","position":{"start":{"line":104,"column":1,"offset":2989},"end":{"line":119,"column":4,"offset":3187},"indent":[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1]}},{"type":"heading","depth":3,"children":[{"type":"link","url":"#自环特殊配置-loopcfg","title":null,"children":[],"data":{"hProperties":{"aria-label":"自环特殊配置 loopcfg 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":"自环特殊配置 loopCfg","position":{"start":{"line":122,"column":5,"offset":3194},"end":{"line":122,"column":19,"offset":3208},"indent":[]}}],"position":{"start":{"line":122,"column":1,"offset":3190},"end":{"line":122,"column":19,"offset":3208},"indent":[]},"data":{"id":"自环特殊配置-loopcfg","htmlAttributes":{"id":"自环特殊配置-loopcfg"},"hProperties":{"id":"自环特殊配置-loopcfg"}}},{"type":"paragraph","children":[{"type":"text","value":"Object 类型。通过 ","position":{"start":{"line":123,"column":1,"offset":3209},"end":{"line":123,"column":14,"offset":3222},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">loopCfg</code>","position":{"start":{"line":123,"column":14,"offset":3222},"end":{"line":123,"column":23,"offset":3231},"indent":[]}},{"type":"text","value":" 配置自环的方位、高度、顺逆时针。","position":{"start":{"line":123,"column":23,"offset":3231},"end":{"line":123,"column":40,"offset":3248},"indent":[]}}],"position":{"start":{"line":123,"column":1,"offset":3209},"end":{"line":123,"column":40,"offset":3248},"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\">position</code>","position":{"start":{"line":125,"column":3,"offset":3252},"end":{"line":125,"column":13,"offset":3262},"indent":[]}},{"type":"text","value":": 指定自环与节点的相对位置。默认为:","position":{"start":{"line":125,"column":13,"offset":3262},"end":{"line":125,"column":32,"offset":3281},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">top</code>","position":{"start":{"line":125,"column":32,"offset":3281},"end":{"line":125,"column":37,"offset":3286},"indent":[]}},{"type":"text","value":"。支持的值有:","position":{"start":{"line":125,"column":37,"offset":3286},"end":{"line":125,"column":44,"offset":3293},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">top</code>","position":{"start":{"line":125,"column":44,"offset":3293},"end":{"line":125,"column":49,"offset":3298},"indent":[]}},{"type":"text","value":", ","position":{"start":{"line":125,"column":49,"offset":3298},"end":{"line":125,"column":51,"offset":3300},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">top-right</code>","position":{"start":{"line":125,"column":51,"offset":3300},"end":{"line":125,"column":62,"offset":3311},"indent":[]}},{"type":"text","value":", ","position":{"start":{"line":125,"column":62,"offset":3311},"end":{"line":125,"column":64,"offset":3313},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">right</code>","position":{"start":{"line":125,"column":64,"offset":3313},"end":{"line":125,"column":71,"offset":3320},"indent":[]}},{"type":"text","value":",","position":{"start":{"line":125,"column":71,"offset":3320},"end":{"line":125,"column":72,"offset":3321},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">bottom-right</code>","position":{"start":{"line":125,"column":72,"offset":3321},"end":{"line":125,"column":86,"offset":3335},"indent":[]}},{"type":"text","value":", ","position":{"start":{"line":125,"column":86,"offset":3335},"end":{"line":125,"column":88,"offset":3337},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">bottom</code>","position":{"start":{"line":125,"column":88,"offset":3337},"end":{"line":125,"column":96,"offset":3345},"indent":[]}},{"type":"text","value":", ","position":{"start":{"line":125,"column":96,"offset":3345},"end":{"line":125,"column":98,"offset":3347},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">bottom-left</code>","position":{"start":{"line":125,"column":98,"offset":3347},"end":{"line":125,"column":111,"offset":3360},"indent":[]}},{"type":"text","value":", ","position":{"start":{"line":125,"column":111,"offset":3360},"end":{"line":125,"column":113,"offset":3362},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">left</code>","position":{"start":{"line":125,"column":113,"offset":3362},"end":{"line":125,"column":119,"offset":3368},"indent":[]}},{"type":"text","value":", ","position":{"start":{"line":125,"column":119,"offset":3368},"end":{"line":125,"column":121,"offset":3370},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">top-left</code>","position":{"start":{"line":125,"column":121,"offset":3370},"end":{"line":125,"column":131,"offset":3380},"indent":[]}}],"position":{"start":{"line":125,"column":3,"offset":3252},"end":{"line":125,"column":131,"offset":3380},"indent":[]}}],"position":{"start":{"line":125,"column":1,"offset":3250},"end":{"line":125,"column":131,"offset":3380},"indent":[]}},{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">dist</code>","position":{"start":{"line":126,"column":3,"offset":3383},"end":{"line":126,"column":9,"offset":3389},"indent":[]}},{"type":"text","value":": 从节点 keyShape 的边缘到自环最顶端的位置,用于指定自环的曲度,默认为节点的高度。","position":{"start":{"line":126,"column":9,"offset":3389},"end":{"line":126,"column":56,"offset":3436},"indent":[]}}],"position":{"start":{"line":126,"column":3,"offset":3383},"end":{"line":126,"column":56,"offset":3436},"indent":[]}}],"position":{"start":{"line":126,"column":1,"offset":3381},"end":{"line":126,"column":56,"offset":3436},"indent":[]}},{"type":"listItem","spread":false,"checked":null,"children":[{"type":"paragraph","children":[{"type":"html","value":"<code class=\"language-text\">clockwise</code>","position":{"start":{"line":127,"column":3,"offset":3439},"end":{"line":127,"column":14,"offset":3450},"indent":[]}},{"type":"text","value":": 指定是否顺时针画环,默认为 ","position":{"start":{"line":127,"column":14,"offset":3450},"end":{"line":127,"column":30,"offset":3466},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">true</code>","position":{"start":{"line":127,"column":30,"offset":3466},"end":{"line":127,"column":36,"offset":3472},"indent":[]}},{"type":"text","value":"。","position":{"start":{"line":127,"column":36,"offset":3472},"end":{"line":127,"column":37,"offset":3473},"indent":[]}}],"position":{"start":{"line":127,"column":3,"offset":3439},"end":{"line":127,"column":37,"offset":3473},"indent":[]}}],"position":{"start":{"line":127,"column":1,"offset":3437},"end":{"line":127,"column":37,"offset":3473},"indent":[]}}],"position":{"start":{"line":125,"column":1,"offset":3250},"end":{"line":127,"column":37,"offset":3473},"indent":[1,1]}},{"type":"paragraph","children":[{"type":"text","value":"基于上面 ","position":{"start":{"line":129,"column":1,"offset":3475},"end":{"line":129,"column":6,"offset":3480},"indent":[]}},{"type":"link","title":null,"url":"#XQFb2","children":[{"type":"text","value":"样式属性 style","position":{"start":{"line":129,"column":7,"offset":3481},"end":{"line":129,"column":17,"offset":3491},"indent":[]}}],"position":{"start":{"line":129,"column":6,"offset":3480},"end":{"line":129,"column":26,"offset":3500},"indent":[]}},{"type":"text","value":" 中的代码,下面代码在 ","position":{"start":{"line":129,"column":26,"offset":3500},"end":{"line":129,"column":38,"offset":3512},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">defaultNode</code>","position":{"start":{"line":129,"column":38,"offset":3512},"end":{"line":129,"column":51,"offset":3525},"indent":[]}},{"type":"text","value":" 中增加了 ","position":{"start":{"line":129,"column":51,"offset":3525},"end":{"line":129,"column":57,"offset":3531},"indent":[]}},{"type":"html","value":"<code class=\"language-text\">loopCfg</code>","position":{"start":{"line":129,"column":57,"offset":3531},"end":{"line":129,"column":66,"offset":3540},"indent":[]}},{"type":"text","value":" 配置项进行文本的配置,使之达到如下图效果。","position":{"start":{"line":129,"column":66,"offset":3540},"end":{"line":129,"column":88,"offset":3562},"indent":[]}},{"type":"html","value":"<br />","position":{"start":{"line":129,"column":88,"offset":3562},"end":{"line":129,"column":94,"offset":3568},"indent":[]}},{"type":"image","title":null,"url":"https://cdn.nlark.com/yuque/0/2019/png/156681/1570878028299-38f92dba-d79a-4071-8b28-4da7ff3f07fe.png#align=left&display=inline&height=56&name=image.png&originHeight=112&originWidth=204&search=&size=15251&status=done&width=102","alt":"image.png","position":{"start":{"line":129,"column":94,"offset":3568},"end":{"line":129,"column":333,"offset":3807},"indent":[]}}],"position":{"start":{"line":129,"column":1,"offset":3475},"end":{"line":129,"column":333,"offset":3807},"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> data <span class=\"token operator\">=</span> <span class=\"token punctuation\">{</span>\n <span class=\"token comment\">// ... data 内容</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">;</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 <span class=\"token comment\">// ... 图的其他配置</span>\n defaultEdge<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">{</span>\n <span class=\"token comment\">// ... 其他配置</span>\n loopCfg<span class=\"token punctuation\">:</span> <span class=\"token punctuation\">{</span>\n position<span class=\"token punctuation\">:</span> <span class=\"token string\">'left'</span><span class=\"token punctuation\">,</span>\n dist<span class=\"token punctuation\">:</span> <span class=\"token number\">100</span><span class=\"token punctuation\">,</span>\n clockwise<span class=\"token punctuation\">:</span> <span class=\"token boolean\">false</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">}</span><span class=\"token punctuation\">,</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n<span class=\"token comment\">// ...</span>\n</code></pre></div>","position":{"start":{"line":130,"column":1,"offset":3808},"end":{"line":146,"column":4,"offset":4038},"indent":[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1]}}],"position":{"start":{"line":1,"column":1,"offset":0},"end":{"line":147,"column":1,"offset":4039}}}}