Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

make node.size accept both height and width #336

Closed
marcopiii opened this issue Jun 10, 2020 · 3 comments
Closed

make node.size accept both height and width #336

marcopiii opened this issue Jun 10, 2020 · 3 comments
Labels
enhancement improving existent functionality or performance related

Comments

@marcopiii
Copy link
Contributor

The node.size parameter takes a number and uses it to define a square area where the returned JSX.Element of viewGenerator is rendered.
The problem is that if the element I want to render is not a square there will be some invisible leftover space around it that could be (wrongly) used to drag the node: i may wont to draw a 200x100 rectangle, but the draggable area would be 200x200 anyway.

Also I found by trial and error that the unit of measure is px/10: the node size must be 2000 to be able to render correctly a JSX.Element with width 200px. This is not obvious and not described in the documentation.

It would be useful to be able to define both width and heigh of the node area.

@danielcaldas
Copy link
Owner

I don't think it would be a good idea to change the size API, it's simply a direct mapping to the d3-shape#size which accepts a number.

An alternative would be to allow clients to specify the width and height properties side by side with the node generator. The API I'm suggestion would affect only nodes that provide: width + height + viewGenerator (falling back to size in case width and height are not provided), something like:

// ...
node: {
  viewGenerator: () => /*your component to render in the node*/
  viewWidth: 200, // numerical value representative of px
  viewHeight: 100 // numerical value representative of px
//...

What do you think @Aslug @terah

@danielcaldas danielcaldas added the needs more info not enough proof to specify issue label Jul 2, 2020
@danielcaldas
Copy link
Owner

@Aslug please use the issue templates next time you submit a feature request/bug fix. Thanks!

@danielcaldas danielcaldas added enhancement improving existent functionality or performance related in progress and removed needs more info not enough proof to specify issue labels Jul 3, 2020
@danielcaldas
Copy link
Owner

Released in react-d3-graph 2.5.0.

Repository owner locked as resolved and limited conversation to collaborators Nov 30, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
enhancement improving existent functionality or performance related
Projects
None yet
Development

No branches or pull requests

2 participants