I have a DB table with records that have connection to one another. sort of like object a comes before b, and object c comes after c.
example- table1-
Id | pre | post

I have all the connections in the DB, what I'm trying to do is to make some sort of way to show all the connections on the page, in a graphical and simple way.

the results should look something like this, but they don't have to, as long as it's clearly shown in any other form.


I got the suggestion on trying GD Library.
the main problem is not how to create the boxes with the words, it's how to connect the boxes. GD has functions that draw lines..but I don't see how I can automaticly make 2 boxes connect, and even if I can, still there are so many connections that ,the lines are gonna go on top or behind the boxes and I'm afraid it's gonna look aweful and unclear.

has anyone who knows and worked with GD thinks it possible to do this using GD or I need to look for other options?

It's definitely possible with the GD library but from reading your question I feel like your expectations of the capabilities of the GD library are too big.

The GD library exists only for basic drawing functions, it will not check for you whether two lines are intersecting for instance.
I wouldn't know of any library for PHP that ís capable of doing such things for you and I wouldn't bother looking for one as finding it and getting it set-up right would take just as much time as coding by hand.

I suggest you think of your goal in an abstract way, completely disjunt from any programming tools. This way you should be able to come up with a set of rules or guidelines to which you want your image to adhere.
Once you have those rules you can come back to programming and thinking about how to implement your set of rules.

Hopefully you are willing to give this a shot and if you do but get stuck this forum will be glad to help you. :)

You could make a full horizontally oriented image, maybe. What I mean is for example when you retrieve data from your database, you coun't how many boxes you're gonna have to make for each column, then you place those boxes underneath eachother (you will need to calculate where you're gonna place them, so you will be able to calculate where you should draw your lines from and to, as well) and connect them with lines.

Something like:

A -- G
|-- D
B -- A
|-- C
|-- D -- X
|-- Y
C -- W

if it was 1 connection from each box to another box I'd do just that, but there can be multiple connections to each box, so 1 box from col1 can be connected to a box in col 6 (there are 6 cols) and in col4 and in col3..so no matter how huge the image is and how much separation between the boxes it's still very messy..
yeah I think GD is not the way to go with this..
but thank you for all your answers!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.