在d3可折叠树上增加线/节点之间的空间

Question

我想自定义我的d3图表collapsible tree

如果需要源代码，请参见以下D3示例：https://bl.ocks.org/mbostock/4339083

我想在所有行/节点之间留出更多空间。

<rect><text>MyText in a Rectangle</text></rect> 

如何使用CSS轻松实现这一目标？

最佳

Answer 1

它是SVG图片，不是常规的HTML DOM元素。所以我不确定如何使用简单的CSS来修复它。

但是我发现一个更简单的解决方案是仅访问创建的d3.layout.tree对象的split属性 。 在您的Codepen示例中的第126行，您只需更改：

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize {

    return CGSize(width: view.frame.width, height: 330)
}

到

$dateTime = new DateTime('2018-09-27T18:30:00.000Z');
$databaseFormat = $dateTime->format('Y-m-d H:i:s');