基本信息
源码名称:zrend echart 展示家庭图谱示例代码(类思维导图)
源码大小:1.77M
文件格式:.zip
开发语言:js
更新时间:2016-01-20
友情提示:(无需注册或充值,赞助后即可获取资源下载链接)
嘿,亲!知识可是无价之宝呢,但咱这精心整理的资料也耗费了不少心血呀。小小地破费一下,绝对物超所值哦!如有下载和支付问题,请联系我们QQ(微信同号):813200300
本次赞助数额为: 2 元×
微信扫码支付:2 元
×
请留下您的邮箱,我们将在2小时内将文件发到您的邮箱
源码介绍
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>kforce</title> <script src="js/esl.js"></script> </head> <body> <div id = "demo1" style="height:800px;border:1px solid #ccc;padding:1px;" ></div> <script type="text/javascript"> require.config({ packages:[{ name:'echarts', location:'./echarts/src', main:'echarts' },{ name:'zrender', location:'./zrender/src', main:'zrender' }] }); var option = { title : { text: '人物关系:乔布斯', subtext: '数据来自人立方', x:'right', y:'bottom' }, tooltip : { trigger: 'item', formatter: '{a} : {b}' }, legend: { x: 'left', selected:{'朋友':true,'家人':true}, data:['家人','朋友'] }, isShowScrollBar:false, series: [ { type:'kforce', categories : [ { name: '人物', itemStyle: { normal: { color : '#ff7f50' } } }, { name: '家人', itemStyle: { normal: { color : '#ff7f50' } } }, { name:'朋友', itemStyle: { normal: { color : '#87cdfa' } } } ], itemStyle: { normal: { label: { show: true, textStyle: { color: '#000000' } }, nodeStyle : { brushType : 'both', strokeColor : 'rgba(255,215,0,0.4)', lineWidth : 2 } },emphasis:{ linkStyle : { strokeColor : '#5182AB'} } }, minRadius : 15, maxRadius : 25, density : 0.8, attractiveness: 0.8, nodes:[ {category:0, name: '乔布斯', value : 10,shapeType:'rectangle',onclick:function(params){ alert(params.target.style.text); params.target.style.text = "雷布斯"; }, itemStyle:{ normal:{ width:100, height:80 } }}, {category:1, name: '丽萨-乔布斯',value : 2,shapeType:'ellipse', itemStyle:{ normal:{ a:40, b:20 } }}, {category:1, name: '保罗-乔布斯',value : 3}, {category:1, name: '克拉拉-乔布斯',value : 3}, {category:1, name: '劳伦-鲍威尔',value : 7}, {category:2, name: '史蒂夫-沃兹尼艾克',value : 5}, {category:2, name: '奥巴马',value : 8,shapeType:'rectangle'}, {category:2, name: '比尔-盖茨',value : 9}, {category:2, name: '乔纳森-艾夫',value : 4}, {category:2, name: '蒂姆-库克',value : 4}, {category:2, name: '龙-韦恩',value : 1}, ], links : [ {source : 1, target : 0, weight : 1, onclick:function(params){ alert(params.target.style.text); }, itemStyle:{ normal:{ lineWidth:10, text:'丽萨-乔布斯', textColor:'#030303', textFont:'bold 15px verdana', textPosition:'inside' } }}, {source : 2, target : 0, weight : 2}, {source : 3, target : 0, weight : 1}, {source : 4, target : 0, weight : 2}, {source : 5, target : 0, weight : 3}, {source : 6, target : 0, weight : 6}, {source : 7, target : 0, weight : 6}, {source : 8, target : 0, weight : 1}, {source : 9, target : 0, weight : 1}, {source : 10, target : 0, weight : 1} ] } ] }; require( [ 'echarts', 'echarts/chart/kforce', ], function(ec) { var myChart = ec.init(document.getElementById('demo1')); myChart.setOption(option); } ) </script> </body> </html>