Question: How can I edit the style on the tree component?

David-Desmaisons / Vue.D3.tree

Vue component to display tree based on D3.js layout.

https://david-desmaisons.github.io/Vue.D3.tree/tree

MIT License

878 stars 136 forks source link

Question: How can I edit the style on the tree component? #36

Closed beyondnetPeru closed 5 years ago

beyondnetPeru commented 5 years ago

Exists any form that we can edit styles on the tree component. For instance, I would like to change the color of each node, font size, line colors, etc.

Do you have any recommendation?

darmen commented 5 years ago

Hi @beyondnetPeru. You can do it using CSS:

.treeclass .nodetree text {
    font-family: ...
    font-size: ...
}

.treeclass .nodetree circle {
    fill: ...
}

.treeclass .linktree {
    stroke: ...
    stroke-width: ...
}

David-Desmaisons commented 5 years ago

@beyondnetPeru You can: 1) Use CSS as stated by @darmen 2) Use node slot (version > 4.0.0) to render different grafics on each node

emelendez commented 3 years ago

See my dynamic way in #60