前端代码如下
第一个Ajax获取的数据为 Map类型
第二个Ajax获取的数据为 Map,Double>
死活画不出来关系图,救救孩子吧!
var getNodes = function(){
var result = [];
var temp = {};
$.ajax({
url: "toFPtree2",
type: "post",
dataType: "json",
contentType : "json",
success : function(data){
for(var k in data){
temp = { name:k, value:data[k]};
result.push(temp);
}
}
});
return result;
};
var getLinks = function(){
var result = [];
var temp = {};
$.ajax({
url: "toFPtree",
dataType: "json",
type: "post",
success : function(data){
for (var k in data){
temp = {source : k.k, target : k[k], value : data[k]};
result.push(temp);
}
}
});
return result;
};
//生成节点所需的数据对象
var data1 = getNodes().map(function (node) {
return {
//x: node.x,
//y: node.y,
name: node.name,
value : node.value,
symbolSize: node.value//支持度越大,节点越大
};
});
//生成连线所需的数据对象
var link1 = getLinks().map(function (node) {
return {
source: node.source,
target: node.target,
value: node.value+'(可信度)',
label: {
normal: {
show: false,
formatter: function (x) {
return node.value;
}
}
},
lineStyle: {
normal: {
width : 20*(node.value - 0.4),//可信度越高,连线越粗
color : 'source'
}
}
};
});
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
option = {
title: {
text: '关联分析结果'
},
legend: {
},
tooltip: {
},
series : [
{
type: 'graph',
layout:'force',//'circular','force'
focusNodeAdjacency:true,//当鼠标移动到节点上,突出显示节点以及节点的边和邻接节点
draggable: true,//指示节点是否可以拖动
roam: true,
data: getNodes(),
links: [],
label: {
normal: {
show: true
}
},
edgeSymbol: ['none', 'arrow'],
edgeSymbolSize: 12,
edgeLabel: {
normal: {
textStyle: {
fontSize: 8
}
}
},
force: {
repulsion: 50,
gravity:0.1,
edgeLength: [100,400]
},
itemStyle:{
normal: {
borderColor: '#fff',
borderWidth: 1,
shadowBlur: 10,
layoutAnimation: true
}
},
lineStyle: {
normal: {
curveness: 0.3
}
}
}
]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
1、先检查你的json是否错误
2、 把你的json放在官网的实例里面看能不能显示
如果说在在官网都不能显示效果则说明你的json 是错误的,如果能显示则拷贝他的代码
在就是你的请求是否是异步的 是否是图表先执行 你的ajax是后执行 则会导致图表没数据
把给表图设值和myChart.setOption(option);放在ajax的success里面就行
PROMISE可以了解一下,新版的jquery都有封装。 异步问题
https://www.echartsjs.com/examples/zh/editor.html?c=line-simple
打log,输出的json在官网上跑下,看有没有报错。