数据嵌入js的关系图

参照echarts官网，改了一下效果图：

数据放在了js里。

代码：

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html style="height: 100%">
   <head>
       <meta charset="utf-8">
   </head>
   <body style="height: 100%; margin: 0">
       <div id="container" style="height: 100%"></div>
          <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
         <script src="echarts.min.js"></script>
        <script src="dataTool.js"></script>
       <script type="text/javascript">
var dom = document.getElementById("container");
var myChart = echarts.init(dom);
var app = {};
option = null;
myChart.hideLoading();
        categories=[
            {
                "name": "人物",
                "keyword": {},
                "base": "HTMLElement"
            },
            {
                "name": "机构",
                "keyword": {},
                "base": "WebGLRenderingContext"
            },
            {
                "name": "行为",
                "keyword": {},
                "base": "SVGElement"
            },
            {
                "name": "地点",
                "keyword": {},
                "base": "CSSRule"
            },
            {
                "name": "主题",
                "keyword": {}
            }
        ],
        nodes=[
            <%for(int i=;i<;i++){%>
            {
                name: "马<%=i%>",
                value: ,
                category: ,
                symbolSize:,
            },
            {
                name: "刘<%=i%>",
               value: ,
                category:
            },
            {
                name: "是<%=i%>",
                value: ,
                category: ,
            },
            {
                name: "我<%=i%>",
                value: ,
                category:
            },
            <%}%>
        ],
links=[
    <%for(int i=;i<;i++){%>
    {
        source: <%=i%>,
        target: <%=i+%>
    },
    {
        source:<%=i%>,
        target: <%=i*%>
    },
    {
        source:<%=i+%>,
        target: <%=i-%>
    },
    <%}%>
],
    option = {
            /*     color: ['#fc853e','#28cad8','#9564bf','#bd407e','#e5a214'], 用来改点的颜色*/
        legend: {
            data: ['人物', '机构', '行为', '地点', '主题']
        },
        series: [{
            type: 'graph',
            layout: 'force',
            roam: true,    //实现缩放
            animation: false,
            label: {
                normal: {
                    position: 'right',
                    formatter: '{b}'
                }
            },
            draggable: true,
            data: nodes.map(function (node, idx) {
                node.id = idx;
                return node;
            }),
            categories: categories,
            force: {
                // initLayout: 'circular'
                // repulsion: 20,
                edgeLength: ,
                repulsion: ,
                gravity: 0.2
            },
            edges: links
        }]
    };

    myChart.setOption(option);
    myChart.on('click', function (params) {
        var data=params.value
        //点没有source属性
        if(data.source==undefined){
            nodeName=params.name
            window.open("NewFile1.jsp?a=mjh")
        }

});
if (option && typeof option === "object") {
    myChart.setOption(option, true);
}

       </script>
   </body>
</html>