You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+33Lines changed: 33 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -11,6 +11,7 @@ React D3 Tree is a [React](http://facebook.github.io/react/) component that lets
11
11
-[Installation](#installation)
12
12
-[Usage](#usage)
13
13
-[Props](#props)
14
+
-[Styling](#styling)
14
15
-[External data sources](#external-data-sources)
15
16
16
17
@@ -87,6 +88,38 @@ class MyComponent extends Component {
87
88
|`scaleExtent`|`object`|||`{min: 0.1, max: 1}`| Sets the minimum/maximum extent to which the tree can be scaled if `props.zoomable` is true. |
88
89
|`transitionDuration`|`number`|`0..n`||`500`| Sets the animation duration (in ms) of each expansion/collapse of a tree node. <br /><br /> Set this to `0` to deactivate animations completely. |
89
90
91
+
92
+
## Styling
93
+
The tree's `styles` prop may be used to override any of the tree's default styling.
94
+
The following object shape is expected by `styles`:
95
+
```js
96
+
{
97
+
links:<svgStyleObject>,
98
+
nodes: {
99
+
node: {
100
+
circle:<svgStyleObject>,
101
+
name:<svgStyleObject>,
102
+
attributes:<svgStyleObject>,
103
+
},
104
+
leafNode: {
105
+
circle:<svgStyleObject>,
106
+
name:<svgStyleObject>,
107
+
attributes:<svgStyleObject>,
108
+
},
109
+
},
110
+
}
111
+
```
112
+
where `<svgStyleObject>` is any object containing CSS-like properties that are compatible with an `<svg>` element's `style` attribute, for example:
113
+
```js
114
+
{
115
+
stroke:'blue',
116
+
strokeWidth:3,
117
+
}
118
+
```
119
+
120
+
For more information on the SVG `style` attribute, [check this out](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/style).
121
+
122
+
90
123
## External data sources
91
124
Statically hosted JSON or CSV files can be used as data sources via the additional `treeUtil` module.
0 commit comments