任何人都可以告诉我如何从mysql数据库访问数据到D3.js我是D3的新手。
<script>
<div class="contentPanel">
<div class="block">
<div id="linkAnalysis"></div>
<script>
var width = screen.width - 450, height = screen.height- 150;
var color = d3.scale.category20();
var force = d3.layout.force()
.charge(-120)
.linkDistance(30)
.size([width, height]);
var svg = d3.select("#linkAnalysis").append("svg")
.attr("width", width)
.attr("height", height);
d3.json("linked.json", function(error, graph) {
force
.nodes(graph.nodes)
.links(graph.links)
.start();
var link = svg.selectAll(".link")
.data(graph.links)
.enter().append("line")
.attr("class", "link")
.style("stroke-width", function(d) {
return Math.sqrt(d.value);
});
var node = svg.selectAll(".node")
.data(graph.nodes)
.enter().append("circle")
.attr("class", "node")
.attr("r", 5)
.style("fill", function(d) {
return color(d.group);
})
.call(d3.behavior.drag()
.origin(function(d) {
return d;
})
.on("drag", function(d) {
d.x = d3.event.x, d.y = d3.event.y;
d3.select(this).attr("cx", d.x).attr("cy", d.y);
link.filter(function(l) {
return l.source === d;
}).attr("x1", d.x).attr("y1", d.y);
link.filter(function(l) {
return l.target === d;
}).attr("x2", d.x).attr("y2", d.y);
}));
node.append("title")
.text(function(d) {
return d.name;
});
force.on("tick", function() {
link.attr("x1", function(d) {
return d.source.x;
})
.attr("y1", function(d) {
return d.source.y;
})
.attr("x2", function(d) {
return d.target.x;
})
.attr("y2", function(d) {
return d.target.y;
});
node.attr("cx", function(d) {
return d.x;
})
.attr("cy", function(d) {
return d.y;
});
});
});
</script>
这是我的json
{
"nodes":[
{"name":"7872000105","group":1},
{"name":"7872005016","group":1},
{"name":"7872006584","group":1},
{"name":"7872010000","group":1},
{"name":"7872010001","group":1},
{"name":"7872010003","group":1},
{"name":"7872010030","group":4},
{"name":"7872010033","group":5},
{"name":"7872010034","group":4},
{"name":"7872010035","group":0},
{"name":"7872010036","group":2},
{"name":"7872010038","group":3},
{"name":"7872010039","group":2},
{"name":"7872010040","group":2},
{"name":"7872010042","group":2},
{"name":"7872010043","group":2},
{"name":"7872010044","group":2},
{"name":"7872010045","group":2},
{"name":"7872010046","group":2},
{"name":"7872010047","group":2},
{"name":"7872010048","group":4},
{"name":"7872010049","group":6},
{"name":"7872010050","group":4},
{"name":"7872010077","group":8},
{"name":"7872010078","group":8},
{"name":"7872010080","group":8},
{"name":"7872010335","group":4},
{"name":"7872010337","group":4},
{"name":"7872010338","group":4},
{"name":"7872010339","group":4},
{"name":"7872010350","group":5},
{"name":"7872010356","group":10},
{"name":"7872010362","group":10},
{"name":"7872010369","group":4},
{"name":"7872010095","group":8}
],
"links":[
{"source":1,"target":0,"value":1},
{"source":2,"target":0,"value":8},
{"source":3,"target":0,"value":10},
{"source":3,"target":2,"value":6},
{"source":4,"target":0,"value":1},
{"source":5,"target":0,"value":1},
{"source":6,"target":0,"value":1},
{"source":7,"target":0,"value":1},
{"source":8,"target":0,"value":2},
{"source":9,"target":0,"value":1},
{"source":11,"target":10,"value":1},
{"source":11,"target":3,"value":3},
{"source":21,"target":17,"value":3},
{"source":21,"target":18,"value":3},
{"source":21,"target":19,"value":3},
{"source":21,"target":20,"value":5},
{"source":22,"target":16,"value":3},
{"source":22,"target":17,"value":3},
{"source":22,"target":18,"value":3},
{"source":22,"target":19,"value":3},
{"source":22,"target":20,"value":4},
{"source":22,"target":21,"value":4},
{"source":23,"target":16,"value":3},
{"source":23,"target":17,"value":3},
{"source":23,"target":18,"value":3},
{"source":23,"target":19,"value":3},
{"source":23,"target":20,"value":4},
{"source":23,"target":21,"value":4},
{"source":23,"target":22,"value":4},
{"source":23,"target":12,"value":2},
{"source":23,"target":11,"value":9},
{"source":24,"target":23,"value":2},
{"source":24,"target":11,"value":7},
{"source":25,"target":24,"value":13},
{"source":25,"target":23,"value":1},
{"source":25,"target":11,"value":12},
{"source":26,"target":24,"value":4},
{"source":77,"target":0,"value":1},
{"source":78,"target":0,"value":8},
{"source":79,"target":0,"value":10},
{"source":79,"target":2,"value":6},
{"source":80,"target":0,"value":1},
{"source":80,"target":0,"value":1},
{"source":81,"target":0,"value":1},
{"source":82,"target":0,"value":1},
{"source":83,"target":0,"value":2},
{"source":84,"target":0,"value":1},
{"source":85,"target":19,"value":1},
{"source":86,"target":10,"value":1},
{"source":86,"target":3,"value":3},
{"source":86,"target":2,"value":3},
{"source":86,"target":0,"value":5},
{"source":87,"target":11,"value":1},
{"source":88,"target":11,"value":1},
{"source":89,"target":11,"value":1},
{"source":90,"target":11,"value":1},
{"source":91,"target":11,"value":1},
{"source":92,"target":16,"value":4},
{"source":93,"target":16,"value":4},
{"source":93,"target":17,"value":4},
{"source":94,"target":16,"value":4},
{"source":94,"target":17,"value":4},
{"source":94,"target":18,"value":4},
{"source":95,"target":16,"value":3},
{"source":95,"target":17,"value":3},
{"source":95,"target":18,"value":3},
{"source":95,"target":19,"value":4},
{"source":96,"target":16,"value":3},
{"source":96,"target":17,"value":3},
{"source":96,"target":18,"value":3},
{"source":96,"target":19,"value":3},
{"source":96,"target":20,"value":5},
{"source":97,"target":16,"value":3},
{"source":97,"target":17,"value":3},
{"source":97,"target":18,"value":3},
{"source":97,"target":19,"value":3},
{"source":97,"target":20,"value":4},
{"source":97,"target":21,"value":4},
{"source":98,"target":16,"value":3},
{"source":98,"target":17,"value":3},
{"source":98,"target":18,"value":3},
{"source":98,"target":19,"value":3},
{"source":98,"target":20,"value":4},
{"source":98,"target":21,"value":4},
{"source":98,"target":22,"value":4},
{"source":98,"target":12,"value":2},
{"source":98,"target":11,"value":9},
{"source":99,"target":23,"value":2},
{"source":99,"target":11,"value":7},
{"source":100,"target":24,"value":13},
{"source":100,"target":23,"value":1},
{"source":100,"target":11,"value":12},
{"source":101,"target":24,"value":4},
{"source":101,"target":11,"value":31},
{"source":101,"target":16,"value":1},
{"source":101,"target":25,"value":1},
{"source":102,"target":11,"value":17},
{"source":102,"target":23,"value":5},
{"source":102,"target":25,"value":5},
{"source":102,"target":24,"value":1},
{"source":102,"target":26,"value":1},
{"source":103,"target":11,"value":8},
{"source":103,"target":27,"value":1},
{"source":104,"target":23,"value":1},
{"source":104,"target":27,"value":1},
{"source":104,"target":11,"value":2},
{"source":105,"target":23,"value":1},
{"source":106,"target":30,"value":2},
{"source":106,"target":11,"value":3},
{"source":106,"target":23,"value":2},
{"source":106,"target":27,"value":1},
{"source":107,"target":11,"value":1},
{"source":108,"target":11,"value":2},
{"source":108,"target":27,"value":1},
{"source":109,"target":11,"value":3},
{"source":109,"target":29,"value":2},
{"source":110,"target":11,"value":3},
{"source":110,"target":34,"value":3},
{"source":110,"target":29,"value":2},
{"source":111,"target":34,"value":2},
{"source":111,"target":35,"value":2},
{"source":111,"target":11,"value":2},
{"source":111,"target":29,"value":1},
{"source":112,"target":34,"value":2},
{"source":112,"target":35,"value":2},
{"source":112,"target":36,"value":2},
{"source":112,"target":11,"value":2},
{"source":113,"target":29,"value":1},
{"source":114,"target":34,"value":2},
{"source":114,"target":35,"value":2},
{"source":114,"target":36,"value":2},
{"source":114,"target":37,"value":2},
{"source":114,"target":11,"value":2},
{"source":114,"target":29,"value":1},
{"source":115,"target":25,"value":1},
{"source":116,"target":25,"value":1},
{"source":117,"target":24,"value":2},
{"source":117,"target":25,"value":3},
{"source":118,"target":41,"value":2},
{"source":118,"target":25,"value":2},
{"source":118,"target":24,"value":1},
{"source":119,"target":11,"value":3},
{"source":119,"target":26,"value":1},
{"source":119,"target":27,"value":1},
{"source":120,"target":28,"value":3},
{"source":120,"target":11,"value":1},
{"source":121,"target":28,"value":2},
{"source":122,"target":28,"value":2},
{"source":123,"target":46,"value":1},
{"source":124,"target":47,"value":2},
{"source":124,"target":25,"value":1},
{"source":124,"target":27,"value":1},
{"source":124,"target":11,"value":1},
{"source":125,"target":26,"value":3},
{"source":125,"target":11,"value":2},
{"source":126,"target":49,"value":1},
{"source":126,"target":24,"value":1},
{"source":127,"target":49,"value":9},
{"source":127,"target":26,"value":2},
{"source":127,"target":11,"value":2},
{"source":128,"target":51,"value":1},
{"source":128,"target":39,"value":1},
{"source":129,"target":51,"value":1},
{"source":130,"target":51,"value":2},
{"source":130,"target":49,"value":1},
{"source":130,"target":26,"value":1},
{"source":131,"target":51,"value":6},
{"source":131,"target":49,"value":12},
{"source":131,"target":39,"value":1},
{"source":131,"target":54,"value":1},
{"source":131,"target":26,"value":21},
{"source":131,"target":11,"value":19},
{"source":131,"target":16,"value":1},
{"source":131,"target":25,"value":2},
{"source":131,"target":41,"value":5},
{"source":131,"target":48,"value":4},
{"source":132,"target":49,"value":1},
{"source":132,"target":55,"value":1},
{"source":133,"target":55,"value":1},
{"source":133,"target":41,"value":1},
{"source":133,"target":48,"value":1},
{"source":134,"target":55,"value":7},
{"source":134,"target":48,"value":7},
{"source":134,"target":27,"value":6},
{"source":134,"target":57,"value":1},
{"source":134,"target":11,"value":4},
{"source":135,"target":58,"value":15},
{"source":135,"target":55,"value":5},
{"source":135,"target":48,"value":6},
{"source":135,"target":57,"value":2},
{"source":136,"target":48,"value":1},
{"source":136,"target":58,"value":4},
{"source":136,"target":59,"value":2},
{"source":137,"target":48,"value":2},
{"source":137,"target":58,"value":6},
{"source":137,"target":60,"value":2},
{"source":137,"target":59,"value":5},
{"source":137,"target":57,"value":1},
{"source":137,"target":55,"value":1},
{"source":138,"target":55,"value":9},
{"source":138,"target":58,"value":17},
{"source":138,"target":59,"value":13},
{"source":138,"target":48,"value":7},
{"source":138,"target":57,"value":2},
{"source":138,"target":41,"value":1},
{"source":138,"target":61,"value":6},
{"source":138,"target":60,"value":3},
{"source":139,"target":59,"value":5},
{"source":139,"target":48,"value":5},
{"source":139,"target":62,"value":6},
{"source":139,"target":57,"value":2},
{"source":139,"target":58,"value":4},
{"source":139,"target":61,"value":3},
{"source":139,"target":60,"value":2},
{"source":139,"target":55,"value":1},
{"source":140,"target":55,"value":5},
{"source":140,"target":62,"value":12},
{"source":140,"target":48,"value":5},
{"source":140,"target":63,"value":4},
{"source":140,"target":58,"value":10},
{"source":140,"target":61,"value":6},
{"source":140,"target":60,"value":2},
{"source":140,"target":85,"value":9},
{"source":140,"target":57,"value":1},
{"source":140,"target":11,"value":1},
{"source":141,"target":63,"value":5},
{"source":141,"target":64,"value":7},
{"source":141,"target":48,"value":3},
{"source":141,"target":62,"value":5},
{"source":141,"target":85,"value":5},
{"source":141,"target":61,"value":5},
{"source":141,"target":60,"value":2},
{"source":141,"target":59,"value":5},
{"source":141,"target":57,"value":1},
{"source":141,"target":55,"value":2},
{"source":142,"target":64,"value":3},
{"source":142,"target":58,"value":3},
{"source":142,"target":59,"value":1},
{"source":142,"target":62,"value":2},
{"source":142,"target":65,"value":2},
{"source":142,"target":48,"value":1},
{"source":142,"target":63,"value":1},
{"source":142,"target":61,"value":1},
{"source":142,"target":60,"value":1},
{"source":143,"target":57,"value":3},
{"source":144,"target":25,"value":5},
{"source":144,"target":11,"value":1},
{"source":144,"target":24,"value":1},
{"source":144,"target":27,"value":1},
{"source":144,"target":48,"value":1},
{"source":144,"target":41,"value":1},
{"source":143,"target":25,"value":6},
{"source":143,"target":68,"value":6},
{"source":143,"target":11,"value":1},
{"source":143,"target":24,"value":1},
{"source":143,"target":27,"value":2},
{"source":143,"target":48,"value":1},
{"source":143,"target":41,"value":1},
{"source":144,"target":25,"value":4},
{"source":144,"target":69,"value":4},
{"source":144,"target":68,"value":4},
{"source":144,"target":11,"value":1},
{"source":144,"target":24,"value":1},
{"source":144,"target":27,"value":1},
{"source":144,"target":41,"value":1},
{"source":144,"target":58,"value":1},
{"source":145,"target":27,"value":1},
{"source":145,"target":69,"value":2},
{"source":145,"target":68,"value":2},
{"source":145,"target":70,"value":2},
{"source":145,"target":11,"value":1},
{"source":145,"target":48,"value":1},
{"source":145,"target":41,"value":1},
{"source":145,"target":25,"value":1},
{"source":146,"target":26,"value":2},
{"source":146,"target":27,"value":1},
{"source":146,"target":11,"value":1},
{"source":147,"target":48,"value":2},
{"source":148,"target":48,"value":2},
{"source":148,"target":73,"value":3},
{"source":149,"target":69,"value":3},
{"source":149,"target":68,"value":3},
{"source":149,"target":25,"value":3},
{"source":149,"target":48,"value":1},
{"source":149,"target":41,"value":1},
{"source":149,"target":70,"value":1},
{"source":149,"target":71,"value":1},
{"source":150,"target":64,"value":1},
{"source":150,"target":65,"value":1},
{"source":150,"target":66,"value":1},
{"source":150,"target":63,"value":1},
{"source":150,"target":62,"value":1},
{"source":150,"target":48,"value":1},
{"source":150,"target":65,"value":1},
{"source":151,"target":66,"value":1},
{"source":152,"target":63,"value":1},
{"source":150,"target":58,"value":1},
{"source":77,"target":76,"value":1},
{"source":78,"target":76,"value":8},
{"source":79,"target":76,"value":10},
{"source":79,"target":78,"value":6},
{"source":80,"target":76,"value":1},
{"source":80,"target":76,"value":1},
{"source":81,"target":76,"value":1},
{"source":82,"target":76,"value":1},
{"source":83,"target":76,"value":2},
{"source":84,"target":76,"value":1},
{"source":85,"target":95,"value":1},
{"source":86,"target":85,"value":1},
{"source":86,"target":79,"value":3},
{"source":86,"target":78,"value":3},
{"source":86,"target":76,"value":5},
{"source":87,"target":86,"value":1},
{"source":88,"target":87,"value":1},
{"source":89,"target":88,"value":1},
{"source":90,"target":89,"value":1},
{"source":91,"target":90,"value":1},
{"source":92,"target":91,"value":4},
{"source":93,"target":91,"value":4},
{"source":93,"target":92,"value":4},
{"source":94,"target":91,"value":4},
{"source":94,"target":92,"value":4},
{"source":94,"target":93,"value":4},
{"source":95,"target":91,"value":3},
{"source":95,"target":92,"value":3},
{"source":95,"target":93,"value":3},
{"source":95,"target":94,"value":4},
{"source":96,"target":91,"value":3},
{"source":96,"target":92,"value":3},
{"source":96,"target":93,"value":3},
{"source":96,"target":94,"value":3},
{"source":96,"target":95,"value":5},
{"source":97,"target":91,"value":3},
{"source":97,"target":92,"value":3},
{"source":97,"target":93,"value":3},
{"source":97,"target":94,"value":3},
{"source":97,"target":95,"value":4},
{"source":97,"target":96,"value":4},
{"source":98,"target":91,"value":3},
{"source":98,"target":92,"value":3},
{"source":98,"target":93,"value":3},
{"source":98,"target":94,"value":3},
{"source":98,"target":95,"value":4},
{"source":98,"target":96,"value":4},
{"source":98,"target":97,"value":4},
{"source":98,"target":87,"value":2},
{"source":98,"target":86,"value":9},
{"source":99,"target":98,"value":2},
{"source":99,"target":86,"value":7},
{"source":100,"target":99,"value":13},
{"source":100,"target":98,"value":1},
{"source":100,"target":86,"value":12},
{"source":101,"target":99,"value":4},
{"source":101,"target":86,"value":31},
{"source":101,"target":91,"value":1},
{"source":101,"target":100,"value":1},
{"source":102,"target":86,"value":17},
{"source":102,"target":98,"value":5},
{"source":102,"target":100,"value":5},
{"source":102,"target":99,"value":1},
{"source":102,"target":101,"value":1},
{"source":103,"target":86,"value":8},
{"source":103,"target":102,"value":1},
{"source":104,"target":98,"value":1},
{"source":104,"target":102,"value":1},
{"source":104,"target":86,"value":2},
{"source":105,"target":98,"value":1},
{"source":106,"target":105,"value":2},
{"source":106,"target":86,"value":3},
{"source":106,"target":98,"value":2},
{"source":106,"target":102,"value":1},
{"source":107,"target":86,"value":1},
{"source":108,"target":86,"value":2},
{"source":108,"target":102,"value":1},
{"source":109,"target":86,"value":3},
{"source":109,"target":104,"value":2},
{"source":110,"target":86,"value":3},
{"source":110,"target":109,"value":3},
{"source":110,"target":104,"value":2},
{"source":111,"target":109,"value":2},
{"source":111,"target":110,"value":2},
{"source":111,"target":86,"value":2},
{"source":111,"target":104,"value":1},
{"source":112,"target":109,"value":2},
{"source":112,"target":110,"value":2},
{"source":112,"target":111,"value":2},
{"source":112,"target":86,"value":2},
{"source":113,"target":104,"value":1},
{"source":114,"target":109,"value":2},
{"source":114,"target":110,"value":2},
{"source":114,"target":111,"value":2},
{"source":114,"target":112,"value":2},
{"source":114,"target":86,"value":2},
{"source":114,"target":104,"value":1},
{"source":115,"target":100,"value":1},
{"source":116,"target":100,"value":1},
{"source":117,"target":99,"value":2},
{"source":117,"target":100,"value":3},
{"source":118,"target":116,"value":2},
{"source":118,"target":100,"value":2},
{"source":118,"target":99,"value":1},
{"source":119,"target":86,"value":3},
{"source":119,"target":101,"value":1},
{"source":119,"target":102,"value":1},
{"source":120,"target":103,"value":3},
{"source":120,"target":86,"value":1},
{"source":121,"target":103,"value":2},
{"source":122,"target":103,"value":2},
{"source":123,"target":121,"value":1},
{"source":124,"target":122,"value":2},
{"source":124,"target":100,"value":1},
{"source":124,"target":102,"value":1},
{"source":124,"target":86,"value":1},
{"source":125,"target":101,"value":3},
{"source":125,"target":86,"value":2},
{"source":126,"target":124,"value":1},
{"source":126,"target":99,"value":1},
{"source":127,"target":124,"value":9},
{"source":127,"target":101,"value":2},
{"source":127,"target":86,"value":2},
{"source":128,"target":126,"value":1},
{"source":128,"target":114,"value":1},
{"source":129,"target":126,"value":1},
{"source":130,"target":126,"value":2},
{"source":130,"target":124,"value":1},
{"source":130,"target":101,"value":1},
{"source":131,"target":126,"value":6},
{"source":131,"target":124,"value":12},
{"source":131,"target":114,"value":1},
{"source":131,"target":129,"value":1},
{"source":131,"target":101,"value":21},
{"source":131,"target":86,"value":19},
{"source":131,"target":91,"value":1},
{"source":131,"target":100,"value":2},
{"source":131,"target":116,"value":5},
{"source":131,"target":123,"value":4},
{"source":132,"target":124,"value":1},
{"source":132,"target":130,"value":1},
{"source":133,"target":130,"value":1},
{"source":133,"target":116,"value":1},
{"source":133,"target":123,"value":1},
{"source":134,"target":130,"value":7},
{"source":134,"target":123,"value":7},
{"source":134,"target":102,"value":6},
{"source":134,"target":132,"value":1},
{"source":134,"target":86,"value":4},
{"source":135,"target":133,"value":15},
{"source":135,"target":130,"value":5},
{"source":135,"target":123,"value":6},
{"source":135,"target":132,"value":2},
{"source":136,"target":123,"value":1},
{"source":136,"target":133,"value":4},
{"source":136,"target":134,"value":2},
{"source":137,"target":123,"value":2},
{"source":137,"target":133,"value":6},
{"source":137,"target":135,"value":2},
{"source":137,"target":134,"value":5},
{"source":137,"target":132,"value":1},
{"source":137,"target":130,"value":1},
{"source":138,"target":130,"value":9},
{"source":138,"target":133,"value":17},
{"source":138,"target":134,"value":13},
{"source":138,"target":123,"value":7},
{"source":138,"target":132,"value":2},
{"source":138,"target":116,"value":1},
{"source":138,"target":136,"value":6},
{"source":138,"target":135,"value":3},
{"source":139,"target":134,"value":5},
{"source":139,"target":123,"value":5},
{"source":139,"target":137,"value":6},
{"source":139,"target":132,"value":2},
{"source":139,"target":133,"value":4},
{"source":139,"target":136,"value":3},
{"source":139,"target":135,"value":2},
{"source":139,"target":130,"value":1},
{"source":140,"target":130,"value":5},
{"source":140,"target":137,"value":12},
{"source":140,"target":123,"value":5},
{"source":140,"target":138,"value":4},
{"source":140,"target":133,"value":10},
{"source":140,"target":136,"value":6},
{"source":140,"target":135,"value":2},
{"source":140,"target":85,"value":9},
{"source":140,"target":132,"value":1},
{"source":144,"target":123,"value":1},
{"source":144,"target":116,"value":1},
{"source":145,"target":123,"value":1},
{"source":145,"target":116,"value":1},
{"source":145,"target":100,"value":1},
{"source":146,"target":101,"value":2},
{"source":146,"target":102,"value":1},
{"source":146,"target":86,"value":1},
{"source":147,"target":123,"value":2},
{"source":148,"target":123,"value":2},
{"source":148,"target":147,"value":3},
{"source":149,"target":134,"value":3},
{"source":149,"target":143,"value":3},
{"source":149,"target":100,"value":3},
{"source":149,"target":123,"value":1},
{"source":149,"target":116,"value":1},
{"source":149,"target":145,"value":1},
{"source":149,"target":146,"value":1},
{"source":150,"target":139,"value":1},
{"source":150,"target":140,"value":1},
{"source":150,"target":141,"value":1},
{"source":150,"target":138,"value":1},
{"source":150,"target":137,"value":1},
{"source":150,"target":123,"value":1},
{"source":150,"target":140,"value":1},
{"source":151,"target":141,"value":1},
{"source":152,"target":138,"value":1},
{"source":150,"target":133,"value":1}
]
}
我必须在Servlet中创建一个json，并且必须从那里访问这些数据。数据将通过这些节点填充..请帮助