ajax的值怎样传递到echarts中

在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值为图片说明

2个回答

不是这么写的。
因为ajax是异步,可能还没返回数据,就开始执行请求后面的代码了,图表可能获取不到数据。
把图表相关的代码放到success:function(result){}中。
赋值。直接引用数组名称就行了。
nodes:arr1,
links:arr2

                     roam: 'move',
                    nodes: arr1,
                    links: arr2
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问