echarts绘制关系图，是通过Ajax获取后台数据，结果关系图死活显示不出来，救救孩子吧！

Question

前端代码如下

第一个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);

Answer 1

1、先检查你的json是否错误

2、 把你的json放在官网的实例里面看能不能显示
如果说在在官网都不能显示效果则说明你的json 是错误的，如果能显示则拷贝他的代码

在就是你的请求是否是异步的 是否是图表先执行 你的ajax是后执行 则会导致图表没数据