在ajax中兩個數組,分別是arr1,arr2;怎樣將數組分別傳遞到echarts中的nodes:[]和links:[]中?求詳細源碼!
部分源碼
<div id="main" style="height:500px;"></div>
<script src="./js/echarts.js" ></script>
<script src="./js/jquery-1.8.3.min.js" ></script>
<script>
var arr1 = [];
var arr2 = [];
$.ajax({
type:"POST",
async:false,
url:"mapdata.php",
dataType:"json",
success: function(result){
var str = result;
for (var i = 0; i < str.length; i++) {
arr1.push("{"+"category:"+str[i].category,"name:'"+str[i].name+"'","value:"+str[i].value+"}");
}
//document.write(arr1);
for (var i = 0; i < str.length; i++) {
arr2.push("{"+"source:'"+str[i].source+"'","target:'"+str[i].target+"'","weight:"+str[i].weight,"name:'"+str[i].name_nexus+"'"+"}");
}
//document.write(arr2);
},
error:function(errorMsg){
alert("請求數據失敗!");
},
});
require.config({
paths:{
echarts:'./js'
}
});
require(
[
'echarts',
'echarts/chart/force'
],
function(ec){
var myChart = ec.init(document.getElementById("main"));
var option = {
title : {
text: '人物關系:葛優',
x:'right',
y:'bottom'
},
tooltip : {
trigger: 'item',
formatter: '{a} : {b}'
},
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
},
nodeStyle : {
//r: 30
},
linkStyle : {}
}
},
useWorker: false,
minRadius : 15,
maxRadius : 25,
gravity: 1.1,
scaling: 1.1,
roam: 'move',
nodes:[
arr1
],
links : [
]
}
]
};
myChart.setOption(option);
}
);
</script>
arr1值為
arr2值為
不是這麼寫的。
因為ajax是異步,可能還沒返回數據,就開始執行請求後面的代碼了,圖表可能獲取不到數據。
把圖表相關的代碼放到success:function(result){}中。
賦值。直接引用數組名稱就行了。
nodes:arr1,
links:arr2