Comments (5)
I would love something like this.
With the current data structure, which looks like so:
[
{
name: 'Parent One',
children: [
{
name: 'Child One',
children: []
}
]
},
{
name: 'Parent Two',
children: []
}
]
'Child One' will never be able to referenced by 'Parent Two', or any other parent for that matter.
Without thinking about the problem space for too long, two potential solutions come to mind:
The first would be to flatten the structure, so that instead of a nested tree structure, like above, each parent would have a collection of foreign keys that reference the primary key of a child:
[{
[
id: 'parentOne',
name: 'Parent One',
children: ['childOne', 'childTwo']
],
[
id: 'parentTwo',
name: 'Parent Two',
children: ['childOne']
],
[
id: 'childOne',
name: 'Child One',
children: []
],
[
id: 'childTwo',
name: 'Child Two',
children: []
],
}]
I could implement something like the above, but with restrictions. e.g. if a child has a second parent, the parent would need to be siblings in the same SkillTreeSegment
, and the children would also need to be at the same level.
This could mean that a child could have n-parents, but the positioning of the children becomes a serious issue.
The second would be for a child to have a canonical parent, where it exists under parent's children
key, while other parents are able to reference it via a key. But some issues that come to mind is determining the implications of having a canonical parent. Positioning will still be an issue, but at least now the onus of how the tree looks will be placed on the person creating their tree. They'll have the control as to which parent should be the canonical parent, and the placement of any secondary parents.
My dream when creating this package would be for people to easily create skill trees like the one you posted. The difference between having a responsive web app that dynamically creates trees, and creating a static video game tree is that the video-game developer/designer can structure the nodes, edges and trees in any way they please, and have full control in doing so.
I would love to see a proposal or a proof-of-concept. Let me know if you have any thoughts on this as well. You've also given me a bit to think about too! Thanks
from beautiful-skill-tree.
If anyone has a working solution, even if it's hacky, please post it.
I need this feature urgently.
from beautiful-skill-tree.
What about allowing skills to have a parents field, complementary to children. It would be backwards compatible (barring any issue I am missing)? If there is no clear problem, I think I can try this approach.
from beautiful-skill-tree.
Was anyone able to connect multiple parents ?
from beautiful-skill-tree.
Same question here, I would love to use this, but I can't at the moment because there is no multiple parents possible.
And with that to chose
- You need both of them to select the skill
- You need at least one of them to select the skill
from beautiful-skill-tree.
Related Issues (20)
- Tooltip onClick HOT 2
- Failed to resolve entry for package "beautiful-skill-tree" - Vite HOT 2
- Horizontal skill-tree
- git cloned, yarn, yarn start = this HOT 1
- React 18.2.0 throws Invalid Hook Call Warning HOT 1
- Auto valided branch
- Add skills leveling HOT 6
- Add a `handleSelected` hook
- Skilltree HOT 4
- Large `nodeDesktopTextNodeWidth` causes the edges to break HOT 2
- The Skill Count's font should be set by Heading Font
- headingFontSize and headingFontColor don't do anything
- Expose progress data in the handleSave method
- Handle clearer descriptions for Trees
- Style error when too many children HOT 8
- Custom Workout: Create Warmups based on selected progressions
- React-native version HOT 2
- NextJS Support HOT 1
- Horizontal tech tree HOT 3
- Allow child skill to require multiple parent skills HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from beautiful-skill-tree.