|
@@ -180,33 +180,6 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="col-sm-6">
|
|
|
- <div class="ibox float-e-margins">
|
|
|
- <div class="ibox-title">
|
|
|
- <h5>和弦图</h5>
|
|
|
- <div class="ibox-tools">
|
|
|
- <a class="collapse-link">
|
|
|
- <i class="fa fa-chevron-up"></i>
|
|
|
- </a>
|
|
|
- <a class="dropdown-toggle" data-toggle="dropdown" href="graph_flot.html#">
|
|
|
- <i class="fa fa-wrench"></i>
|
|
|
- </a>
|
|
|
- <ul class="dropdown-menu dropdown-user">
|
|
|
- <li><a href="graph_flot.html#">选项1</a>
|
|
|
- </li>
|
|
|
- <li><a href="graph_flot.html#">选项2</a>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <a class="close-link">
|
|
|
- <i class="fa fa-times"></i>
|
|
|
- </a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="ibox-content">
|
|
|
- <div class="echarts" id="echarts-chord-chart"></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
<div class="col-sm-6">
|
|
|
<div class="ibox float-e-margins">
|
|
|
<div class="ibox-title">
|
|
@@ -261,33 +234,6 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="col-sm-6">
|
|
|
- <div class="ibox float-e-margins">
|
|
|
- <div class="ibox-title">
|
|
|
- <h5>力导向布局图</h5>
|
|
|
- <div class="ibox-tools">
|
|
|
- <a class="collapse-link">
|
|
|
- <i class="fa fa-chevron-up"></i>
|
|
|
- </a>
|
|
|
- <a class="dropdown-toggle" data-toggle="dropdown" href="graph_flot.html#">
|
|
|
- <i class="fa fa-wrench"></i>
|
|
|
- </a>
|
|
|
- <ul class="dropdown-menu dropdown-user">
|
|
|
- <li><a href="graph_flot.html#">选项1</a>
|
|
|
- </li>
|
|
|
- <li><a href="graph_flot.html#">选项2</a>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <a class="close-link">
|
|
|
- <i class="fa fa-times"></i>
|
|
|
- </a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="ibox-content">
|
|
|
- <div class="echarts" id="echarts-force-chart"></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
@@ -1065,182 +1011,6 @@
|
|
|
mapChart.setOption(mapoption);
|
|
|
$(window).resize(mapChart.resize);
|
|
|
|
|
|
- var chordChart = echarts.init(document.getElementById("echarts-chord-chart"));
|
|
|
- var chordoption = {
|
|
|
- title : {
|
|
|
- text: '测试数据',
|
|
|
- subtext: 'From d3.js',
|
|
|
- x:'right',
|
|
|
- y:'bottom'
|
|
|
- },
|
|
|
- tooltip : {
|
|
|
- trigger: 'item',
|
|
|
- formatter: function (params) {
|
|
|
- if (params.indicator2) { // is edge
|
|
|
- return params.value.weight;
|
|
|
- } else {// is node
|
|
|
- return params.name
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- toolbox: {
|
|
|
- show : true,
|
|
|
- feature : {
|
|
|
- restore : {show: true},
|
|
|
- magicType: {show: true, type: ['force', 'chord']},
|
|
|
- saveAsImage : {show: true}
|
|
|
- }
|
|
|
- },
|
|
|
- legend: {
|
|
|
- x: 'left',
|
|
|
- data:['group1','group2', 'group3', 'group4']
|
|
|
- },
|
|
|
- series : [
|
|
|
- {
|
|
|
- type:'chord',
|
|
|
- sort : 'ascending',
|
|
|
- sortSub : 'descending',
|
|
|
- showScale : true,
|
|
|
- showScaleText : true,
|
|
|
- data : [
|
|
|
- {name : 'group1'},
|
|
|
- {name : 'group2'},
|
|
|
- {name : 'group3'},
|
|
|
- {name : 'group4'}
|
|
|
- ],
|
|
|
- itemStyle : {
|
|
|
- normal : {
|
|
|
- label : {
|
|
|
- show : false
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- matrix : [
|
|
|
- [11975, 5871, 8916, 2868],
|
|
|
- [ 1951, 10048, 2060, 6171],
|
|
|
- [ 8010, 16145, 8090, 8045],
|
|
|
- [ 1013, 990, 940, 6907]
|
|
|
- ]
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- chordChart.setOption(chordoption);
|
|
|
- $(window).resize(chordChart.resize);
|
|
|
-
|
|
|
- var forceChart = echarts.init(document.getElementById("echarts-force-chart"));
|
|
|
- var forceoption ={
|
|
|
- title : {
|
|
|
- text: '人物关系:乔布斯',
|
|
|
- subtext: '数据来自人立方',
|
|
|
- x:'right',
|
|
|
- y:'bottom'
|
|
|
- },
|
|
|
- tooltip : {
|
|
|
- trigger: 'item',
|
|
|
- formatter: '{a} : {b}'
|
|
|
- },
|
|
|
- toolbox: {
|
|
|
- show : true,
|
|
|
- feature : {
|
|
|
- restore : {show: true},
|
|
|
- magicType: {show: true, type: ['force', 'chord']},
|
|
|
- saveAsImage : {show: true}
|
|
|
- }
|
|
|
- },
|
|
|
- legend: {
|
|
|
- x: 'left',
|
|
|
- data:['家人','朋友']
|
|
|
- },
|
|
|
- series : [
|
|
|
- {
|
|
|
- type:'force',
|
|
|
- name : "人物关系",
|
|
|
- ribbonType: false,
|
|
|
- categories : [
|
|
|
- {
|
|
|
- name: '人物'
|
|
|
- },
|
|
|
- {
|
|
|
- name: '家人'
|
|
|
- },
|
|
|
- {
|
|
|
- name:'朋友'
|
|
|
- }
|
|
|
- ],
|
|
|
- itemStyle: {
|
|
|
- normal: {
|
|
|
- label: {
|
|
|
- show: true,
|
|
|
- textStyle: {
|
|
|
- color: '#333'
|
|
|
- }
|
|
|
- },
|
|
|
- nodeStyle : {
|
|
|
- brushType : 'both',
|
|
|
- borderColor : 'rgba(255,215,0,0.4)',
|
|
|
- borderWidth : 1
|
|
|
- },
|
|
|
- linkStyle: {
|
|
|
- type: 'curve'
|
|
|
- }
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- label: {
|
|
|
- show: false
|
|
|
- // textStyle: null // 默认使用全局文本样式,详见TEXTSTYLE
|
|
|
- },
|
|
|
- nodeStyle : {
|
|
|
- //r: 30
|
|
|
- },
|
|
|
- linkStyle : {}
|
|
|
- }
|
|
|
- },
|
|
|
- useWorker: false,
|
|
|
- minRadius : 15,
|
|
|
- maxRadius : 25,
|
|
|
- gravity: 1.1,
|
|
|
- scaling: 1.1,
|
|
|
- roam: 'move',
|
|
|
- nodes:[
|
|
|
- {category:0, name: '乔布斯', value : 10},
|
|
|
- {category:1, name: '丽萨-乔布斯',value : 2},
|
|
|
- {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},
|
|
|
- {category:2, name: '比尔-盖茨',value : 9},
|
|
|
- {category:2, name: '乔纳森-艾夫',value : 4},
|
|
|
- {category:2, name: '蒂姆-库克',value : 4},
|
|
|
- {category:2, name: '龙-韦恩',value : 1},
|
|
|
- ],
|
|
|
- links : [
|
|
|
- {source : '丽萨-乔布斯', target : '乔布斯', weight : 1, name: '女儿'},
|
|
|
- {source : '保罗-乔布斯', target : '乔布斯', weight : 2, name: '父亲'},
|
|
|
- {source : '克拉拉-乔布斯', target : '乔布斯', weight : 1, name: '母亲'},
|
|
|
- {source : '劳伦-鲍威尔', target : '乔布斯', weight : 2},
|
|
|
- {source : '史蒂夫-沃兹尼艾克', target : '乔布斯', weight : 3, name: '合伙人'},
|
|
|
- {source : '奥巴马', target : '乔布斯', weight : 1},
|
|
|
- {source : '比尔-盖茨', target : '乔布斯', weight : 6, name: '竞争对手'},
|
|
|
- {source : '乔纳森-艾夫', target : '乔布斯', weight : 1, name: '爱将'},
|
|
|
- {source : '蒂姆-库克', target : '乔布斯', weight : 1},
|
|
|
- {source : '龙-韦恩', target : '乔布斯', weight : 1},
|
|
|
- {source : '克拉拉-乔布斯', target : '保罗-乔布斯', weight : 1},
|
|
|
- {source : '奥巴马', target : '保罗-乔布斯', weight : 1},
|
|
|
- {source : '奥巴马', target : '克拉拉-乔布斯', weight : 1},
|
|
|
- {source : '奥巴马', target : '劳伦-鲍威尔', weight : 1},
|
|
|
- {source : '奥巴马', target : '史蒂夫-沃兹尼艾克', weight : 1},
|
|
|
- {source : '比尔-盖茨', target : '奥巴马', weight : 6},
|
|
|
- {source : '比尔-盖茨', target : '克拉拉-乔布斯', weight : 1},
|
|
|
- {source : '蒂姆-库克', target : '奥巴马', weight : 1}
|
|
|
- ]
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
- forceChart.setOption(forceoption);
|
|
|
- $(window).resize(forceChart.resize);
|
|
|
-
|
|
|
var gaugeChart = echarts.init(document.getElementById("echarts-gauge-chart"));
|
|
|
var gaugeoption = {
|
|
|
tooltip : {
|