时间戳

首页 > 解决方案 > amcharts_Child 树在单击之前不应打开

javascript - amcharts_Child 树在单击之前不应打开

问题描述

如何让子树在点击时打开？当我们单击父节点 A 时，它会打开其所有子树和子子树。

它应该在点击时打开子子项。就像点击A时一样，它不应该打开A2的子A21。

图表

JS代码如下

/**
 * Documentation is available at:
 * https://www.amcharts.com/docs/v4/
 */

am4core.useTheme(am4themes_animated);

// Create chart
var chart = am4core.create("chartdiv", am4plugins_forceDirected.ForceDirectedTree);

// Create series
var series = chart.series.push(new am4plugins_forceDirected.ForceDirectedSeries());

// Set data
series.data = [{"name": "A",
  "children": [{
    "name": "A1",
    "value": 1,
  }, {
    "name": "A2","value": 1,
    "children": [{
    "name": "A21",
    "value": 1,
  }]
  }, 
               {
    "name": "A3",
    "value": 1,
    }]
}];

// Set up data fields
series.dataFields.value = "value";
series.dataFields.name = "name";
series.dataFields.id = "id";
series.dataFields.children = "children";
series.dataFields.linkWith = "link";
// Add labels
series.nodes.template.label.text = "{name}";
series.nodes.template.label.valign = "center";
series.nodes.template.label.fill=am4core.color("#000");
series.nodes.template.label.dy = 10;
series.fontSize = 12;
series.minRadius = 30;
series.maxRadius = 30;

// Configure circles
series.nodes.template.circle.fillOpacity = 0.5;

HTML 脚本

<script src="//www.amcharts.com/lib/4/core.js"></script>
<script src="//www.amcharts.com/lib/4/charts.js"></script>
<script src="//www.amcharts.com/lib/4/themes/animated.js"></script>
<script src="//www.amcharts.com/lib/4/themes/dataviz.js"></script>
<script src="//www.amcharts.com/lib/4/plugins/forceDirected.js"></script>
<div id="chartdiv"></div>

标签： javascripthtmlcssamchartsamcharts4

解决方案

只需添加禁用扩展所有功能

var nodeTemplate = networkSeries.nodes.template;
nodeTemplate.expandAll = false;

推荐阅读