一.效果展示
二.代码示例
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>D3 test</title>
</head>
<body>
<div class="container">
<div id="graph"></div>
</div>
</body>
</html>
<script src="/static/js/d3-v4.js"></script>
<script>
var nodes = [ {
name: "桂林" }, {
name: "广州" },
{
name: "厦门" }, {
name: "杭州" },
{
name: "上海" }, {
name: "青岛" },
{
name: "天津" } ];
var links = [ {
source : 0 , target: 1 } , {
source : 0 , target: 2 } ,
{
source : 0 , target: 3 } , {
source : 1 , target: 4 } ,
{
source : 1 , target: 5 } , {
source
本文详细介绍了如何使用D3.js V4创建力导向图，包括效果展示、代码示例和注释详解。重点解析了forceManyBody()函数，解释了多体力函数的作用和相关参数，如计算节点间力的近似值函数和Barnes-Hut算法。同时，提到了数据布局后的格式和节点属性的含义。
最低0.47元/天 解锁文章
扫一扫
1442
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
