# How to implement the “technological tree” drawing?

I want to make a tech tree at least like in Civilization, but I don't know how to do it. I want to fill in some data structure and then display it on the screen in the form of a technology tree, but I don't know how to implement it in code.

The only way I came up with was:

public class Technology1
{
String name;
TextButton button;
}


TextButton is the libGDX class with which I was going to display each individual technology on the screen.

LinkedList NextTech- all technologies that are accessed after studying the current one are stored here. In other words, "children" are stored here . The problem is how to set the coordinates for all technologies when rendering the tree, so that the technologies do not overlap when displayed and so that the whole looks more or less normal.

If I started to do it wrong, then please tell me a more correct option.

• Many games arrange the nodes of their tech tree screens by hand. This ensures that it's not just readable but also aesthetically pleasing. Wouldn't that be an option for you? – Philipp Jul 24 '20 at 10:03
• Does your tech tree allow a node to have more than one parent? – Philipp Jul 24 '20 at 10:05
• Yes, you can do it manually. I just thought that the tree would be displayed dynamically, so that while playing, other random technologies may be added to the tech tree during some random events or something, and the tree will display normally. And yet, it is not very convenient to set the coordinates of the technological tree in the code. – Степан Адамов Jul 24 '20 at 10:09
• In future, please edit your existing question so that we can re-open it, rather than deleting it to post a new question. – DMGregory Jul 24 '20 at 13:02

Your implementation looks about right. Just a few code-review changes so it matches Java code styleguide. Remember constructors, getters, and setters:

public class Technology {
private String name;
private Array<Technology> nextTechnologies; // LibGDX's "Array" is a more efficient list
}


As you can see I removed the button from the technology class. It is good practice to separate game logic (the technology tree) from the graphical side (the tech tree graphical layout).

As for the actual layout I would personally manually position all the elements unless you have a massive amount of technologies (100s).

public class TechnologyLayout {
private Sprite sprite;
private Vector2 position;
}

public class TechTreeDrawer {
private ObjectMap<String, TechnologyLayout> layoutMapping;
private Technology root;

public void draw() {
draw(root);
}

private void draw(Technology tech) {
TechnologyLayout layout = layoutMapping.get(tech.getName());

// draw somehow using the sprite and position
batch.draw(layout.getSprite(), layout.getPosition());
tech.getNextTechnologies().forEach(this::draw);
}
}

TechTreeDrawer drawer = new TechTreeDrawer(root);