relation-graph-custom

快速使用：

npm install --save relation-graph-custom


*更多效果及使用方法：*
http://relation-graph.com
---

**自定义v1.1.4：**
修复问题：
* 修复了自动布局时，当收起根节点时，根节点过度抖动问题
* 修改引力计算的时间 layoutTime
* 图谱下载重写(downloadAsImage)
* 重写setJsondata、appendJsonData方法，实现函数回调
* 修复部分样式问题
* 修改refresh 函数，刷新图谱时，返回非隐藏状态的节点
    . `refresh`函数中的参数: 要么两个都传，要么一个也别传
        filterArr[] 代表联系人的actype 比如 [11、12] qq和微信
        callback 回调函数，返回联系人和群组的数量
    . `setJsondata`函数参数：   (jsonData, call, filterArr, callback)
        jsonData 图谱元数据
        call 标识需要回调联系人和群组的数据
        filterArr 代表联系人的actype 比如 [11、12] qq和微信
        callback 回调函数，返回联系人和群组的数量
    . `appendJsonData`函数参数：(jsonData, isRelayout, call, filterArr, callback)
        jsonData 图谱元数据
        isRelayout 是否需要重新布局，相当于一次refresh
        call 标识需要回调联系人和群组的数据
        filterArr 代表联系人的actype 比如 [11、12] qq和微信
        callback 回调函数，返回联系人和群组的数量

**最新版本v1.1.0：**

修改问题：
* 修复了ie浏览器下滚动轴只能放大无法缩小的问题
* 修复了导出图片不全或留白太多的问题
* 修复了工具栏按钮样式错误和节点的收缩按钮样式错误

新特性：
* 为中心布局添加新的配置distance_coefficient，可以设置各层级之间的距离，以达到调整连线长度的视觉效果。请参考：http://relation-graph.com/#/docs/layout 中的章节《center / 中心布局 特有的选项》），示例：http://relation-graph.com/#/demo/distance_coefficient
  
  另外，目前树状布局一直支持距离调整，请参考：http://relation-graph.com/#/docs/layout 中的章节《tree / 树状布局 特有的选项》。示例：http://relation-graph.com/#/demo/tree-distance
* 新增图谱选项：disableDragNode，可以全局禁用节点拖动
* 当图谱的大小发生变化时自动居中（可以通过图谱选项moveToCenterWhenResize禁用此功能）。示例：http://relation-graph.com/#/demo/graph-resize
* 树状数据的支持，即通过{text:a,children: [{b},{c},{d}] }这样的方式定义数据，免去树形图谱的数据扁平化转换。示例：http://relation-graph.com/#/demo/tree-data

---
*v1.0.9：*

主要修改的问题：
* 1，解决了当使用者没有使用element-ui时图谱工具栏样式异常的问题
* 2，默认关闭组件中的打印信息，只有在设置debug时打印信息
* 3，解决了_graph.removeNodeById方法的bug
* 4，解决了当图谱大小调整后调用refresh方法无法让图谱位置居中的问题
* 5，解决了当调整图谱大小后工具栏位置不自动调整的问题
* 6，解决了无法将图谱数据放在Vue data()中的问题

新特性：
* 1，提供一种新布局：固定位置布局《fixed/固定坐标布局》，介绍：http://relation-graph.com/#/docs/layout  示例：http://relation-graph.com/#/demo/layout-diy
* 2，提供getGraphJsonData和getGraphJsonOptions方法，获取图谱中当前所有数据和配置信息的json数据
* 3，提供图谱配置：禁用图谱缩放、禁用工具栏缩放按钮的配置
* 4，提供节点配置：禁用节点拖拽、禁用节点点击的默认选中效果

---

这个项目使用典型的vue编程方式，代码简单易懂，如果需要实现一些高级功能，你还可以直接使用源码作为一个component放到你的项目中去用，如果有一些优化或者新特性，欢迎提交pull request。

如果这个项目能帮到大家，有更多的人关注，后续我会开发用于小程序、react、angular的版本，以及基于canvas的实现。

**有问题可以加QQ：3235808353，提bug、提建议、一起交流分享前端开发心得，第一获取新版本发布消息。**