(semi?) radial layout in Roassal
Locked
(semi?) radial layout in Roassal
 
|
I am trying to create a view with a center node and " provider" and " clients" nodes on either side of the central one. (see attached script) I would like the provider and client to be each arranged in a radial layout (see attached figure) How can this be achieve with Roassal?
 | view | view := ROView new. view addAll: ((sourceElements := ROElement spritesOn: (1 to: 4)) do: [:n | (n @ RODraggable) addShape: ROLabel]).
view addAll: ((targetElements := ROElement spritesOn: (6 to: 10)) do: [:n | (n @ RODraggable) addShape: ROLabel]).
view add: ((centerElement := ROElement spriteOn: 5) @ RODraggable addShape: ROLabel). ROVerticalLineLayout on: sourceElements; on:targetElements. sourceLayer := ROElement new addAll: sourceElements.
view addAll: (sourceElements collect: [:source | ROEdge arrowedLineFrom: source to: centerElement ]). targetLayer := ROElement new addAll: targetElements.
view addAll: (targetElements collect: [:target | ROEdge arrowedLineFrom: centerElement to: target ]). (ROHorizontalLineLayout new horizontalGap: 130) applyOn: {sourceLayer. centerElement. targetLayer}.
view open Usman _______________________________________________ Moose-dev mailing list [hidden email] https://www.iam.unibe.ch/mailman/listinfo/moose-dev |
Re: (semi?) radial layout in Roassal
|
|
Hi Usman,
Thanks for your emails. Having a better circle layout has been on our todo list for quite some time. Your email is a nice push up! First of all, remove @RODraggable it is not necessary since you are using spritesOn: I am not really sure why you need the targetLayer and sourceLayer variables. I suspect this is to group the elements right? This is not necessary, you can simply translate them. -=-=-=-=-=-=-=-=-=-=-=-=-=-=-= | view | view := ROView new. view addAll: ((sourceElements := ROElement spritesOn: (1 to: 4)) do: [:n | (n ) addShape: ROLabel]). view addAll: ((targetElements := ROElement spritesOn: (6 to: 10)) do: [:n | (n ) addShape: ROLabel]). view add: ((centerElement := ROElement spriteOn: 5) addShape: ROLabel). ROVerticalLineLayout on: sourceElements; on: targetElements. targetElements do: [ :e | e translateBy: 300 @ 0 ]. centerElement translateBy: 150 @ 0. view addAll: (sourceElements collect: [:source | ROEdge arrowedLineFrom: source to: centerElement ]). view addAll: (targetElements collect: [:target | ROEdge arrowedLineFrom: centerElement to: target ]). view open -=-=-=-=-=-=-=-=-=-=-=-=-=-=-= Update the last version of Roassal. I have worked on a better circle layout. Your script can be: -=-=-=-=-=-=-=-=-=-=-=-=-=-=-= | view | view := ROView new. view addAll: ((sourceElements := ROElement spritesOn: (1 to: 4)) do: [:n | (n ) addShape: ROLabel]). view addAll: ((targetElements := ROElement spritesOn: (6 to: 10)) do: [:n | (n ) addShape: ROLabel]). view add: ((centerElement := ROElement spriteOn: 5) addShape: ROLabel). ROCircleLayout new initialAngleInDegree: 130; initialRadius: 200; initialIncrementalAngleInDegree: 30; on: sourceElements. ROCircleLayout new initialAngleInDegree: -45; initialRadius: 200; initialIncrementalAngleInDegree: 30; on: targetElements. centerElement translateBy: 150 @ 0. view addAll: (sourceElements collect: [:source | ROEdge arrowedLineFrom: source to: centerElement ]). view addAll: (targetElements collect: [:target | ROEdge arrowedLineFrom: centerElement to: target ]). view open -=-=-=-=-=-=-=-=-=-=-=-=-=-=-= Here is the screenshot:  Well... A nicer version could be: -=-=-=-=-=-=-=-=-=-=-=-=-=-=-= | view | view := ROView new. view addAll: ((sourceElements := ROElement spritesOn: (1 to: 4)) do: [:n | (n ) addShape: ROLabel]). view addAll: ((targetElements := ROElement spritesOn: (6 to: 10)) do: [:n | (n ) addShape: ROLabel]). view add: ((centerElement := ROElement spriteOn: 5) addShape: ROLabel). ROCircleLayout new initialAngleInDegree: 130; initialRadius: 200; initialIncrementalAngleInDegree: 30; on: sourceElements. ROCircleLayout new initialAngleInDegree: -45; initialRadius: 200; initialIncrementalAngleInDegree: 30; on: targetElements. centerElement translateBy: 150 @ 150. view addAll: (sourceElements collect: [ :source | (ROEdge from: source to: centerElement) addShape: (ROLine new attachPoint: ROHorizontalAttachPoint instance; add: (ROArrow new offset: 0.3)) ]). view addAll: (targetElements collect: [ :target | (ROEdge from: centerElement to: target) addShape: (ROLine new attachPoint: ROHorizontalAttachPoint instance; add: (ROArrow new offset: 0.3)) ]). view open -=-=-=-=-=-=-=-=-=-=-=-=-=-=-= The screenshot is:  I also have added an animating example: ROExample new circle Does this help? I guess more can be built, for example the amount of elements to locate on the left hand side, and the amount on the right hand side. This should not be that hard. Alexandre On Jan 23, 2013, at 12:33 PM, Usman Bhatti <[hidden email]> wrote:
-- _,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;: Alexandre Bergel http://www.bergel.eu ^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;. _______________________________________________ Moose-dev mailing list [hidden email] https://www.iam.unibe.ch/mailman/listinfo/moose-dev |
Re: (semi?) radial layout in Roassal
|
|
On Wed, Jan 23, 2013 at 11:01 PM, Alexandre Bergel <[hidden email]> wrote:
No problem :-). And thx for the scripts.
Yes that's correct. Now, I do not have one root composed of all the elements. I have some legend elements also to be placed so I create distinct groups of elements. Yes, this requires writing a few lines of code but the manipulation of all these groups of elements is easy. Otherwise, I'll have to calculate all the translations by hand and it requires manually placing elements contained in other elements on the canvas, which would be cumbersome.
Absolutely. The last script provides a better way of displaying arrows when there are too many connections. I'll have a look into the way the script behaves when we have large number of clients and providers. I'll update you on my progress.
usman
_______________________________________________ Moose-dev mailing list [hidden email] https://www.iam.unibe.ch/mailman/listinfo/moose-dev |
Re: (semi?) radial layout in Roassal
|
|
| Free forum by Nabble | Edit this page |