Echarts 关系图谱示例

<!DOCTYPE html>
<html>
<head><meta name="viewport" content="width=device-width"/><title>ECharts 关系图谱</title><script src="jquery-1.10.2.min.js"></script><script src="echarts.min.js"></script><style type="text/css">html, body, #main {height: 100%;width: 100%;margin: 0;padding: 0}</style>
</head>
<body>
<div id="main" style=""></div>
<script type="text/javascript">var myChart = echarts.init(document.getElementById('main'));option = {title: {text: '关系图谱'},tooltip: {formatter: function (x) {return x.data.des;}},series: [{type: 'graph',layout: 'force',symbolSize: 80,roam: true,edgeSymbol: ['circle', 'arrow'],edgeSymbolSize: [4, 10],edgeLabel: {normal: {textStyle: {fontSize: 20}}},force: {repulsion: 2500,edgeLength: [10, 50]},draggable: true,itemStyle: {normal: {color: '#4b565b'}},lineStyle: {normal: {width: 2,color: '#4b565b'}},edgeLabel: {normal: {show: true,formatter: function (x) {return x.data.name;}}},label: {normal: {show: true,textStyle: {}}},data: [{name: '张三',des: '退休',symbolSize: 100,itemStyle: {normal: {color: 'red'}}}, {name: '李四',des: '自己创业',itemStyle: {normal: {color: 'red'}}}, {name: '王五',des: '测试人员',symbolSize: 100}, {name: '天天',des: '程序员',itemStyle: {normal: {color: 'red'}}}],links: [{source: '张三',target: '李四',name: '姐妹',des: '张三与户主【李四】关系为姐妹'}, {source: '王五',target: '李四',name: '朋友'}, {source: '天天',target: '王五',name: "同事"}, {source: '李四',target: '天天',name: "父子"}]}]};myChart.setOption(option);
</script>
</body>
</html>

Echarts 关系图谱示例相关推荐

ECharts 实现人民的名义关系图谱代码开源
1.什么是ECharts ECharts是百度开源的纯 Javascript 图表库,目前开源可以与highcharts相匹敌的一个图表库,相信有很多国内用户使用. 官网 http://echarts ...
echarts做企业关系图谱_使用Echarts呈现天善用户的关系图
前一个博客:"<Python网络数据采集>读后总结 --第3章及天善用户关系分析实例"提到了怎么获取天善用户的关系数据,但没有说如何更好呈现关系图,这次介绍一下使用Ec ...
echarts做企业关系图谱_Echarts绘制关系图（一）
关系图何为关系图,从字面上可以看出,为关系的图形,既然为关系,那么就需要有点以及关系,用来表示点与点之间的联系.所以我们可以得出:关系图需要两个必要的元素,节点,关系,其中关系需要包含有联系的节点以 ...
基于python-django的neo4j人民的名义关系图谱查询系统
简介这个系统主要是基于neo4j的关系图谱联系使用里面的关系是在网上找的数据文件,主要是人民的名义对应关系首先是吧数据对应的节点和关系写入的neo4j里面然后使用django编写了一个web服 ...
PersonGraphDataSet近十万的开放人物关系图谱项目
PersonGraphDataSet PersonGraphDataSet, nearly 10 thousand person2person relationship facts that buil ...
全国高校恋爱关系图谱：北大受宠爱，浙大最孤独
转载于博雅数据库请外卖小哥叫早.点甜品留言道歉.送水果奶茶表白-- 隔空点外卖给自己心仪的女孩男孩传情达意,已经取代鸿雁传书,成为95后.00后大学生的恋爱表白新模式. 近日,饿了么用外卖大数据分 ...
[收藏]基于Spark Graphframes的社交关系图谱项目实战
大家好,我是老兵. 本文是基于Spark Graphframes的社交关系图谱实战演练. 我将结合自身开发和项目经验,分别讲述社交关系图谱原理.图计算原理.Spark Graphframes图计算编程 ...
vue+relation-graphs快速实现组织机构图谱、股权架构图谱、集团关系图谱等知识图谱，树形、力学等关系图
relation-graph关系图谱文章目录 relation-graph关系图谱一.relation-graph简介用途二.使用步骤 1.引入库 2.页面中使用三.参数配置 1.Graph ...
echarts关系图配置，及超出范围处理 + a、b两个节点互相指向时线上的字重叠问题
情景:由于人物关系复杂,可以有几个 --几十个(上百个),所以固定范围内(如:500高度)可能放不下,或者太空.所以可以根据node节点(也可根据其他判断条件)来动态修改 div / canvas高度 ...
InteractiveGraph 实现酷炫关系图谱之前瞻
本文代码和数据等,会等下一篇实战文章更新后一起放在 github/DesertsX 上,敬请期待! 前言话说之前片刻老哥(群主/组织负责人之一)在 ApacheCN 中文开源组织的机器学习群(qq ...

Echarts 关系图谱示例

Echarts 关系图谱示例相关推荐

最新文章

热门文章