Fwd: New ForceBasedLayout

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
6 messages Options
Reply | Threaded
Open this post in threaded view
|

Fwd: New ForceBasedLayout

MathieuDehouck

Hi

So I've been working on the forcebasedlayout for more than a week now,
here are some news.

I've translated the D3 code, and have implemented a new quadtree, the
mondrian one wasn't that compatible.

But, I have a problem, it seems there is no more bug in th code, but it
still doesn't do what is expected, so I read and read th D3 code and
don't find where are my mistakes. I've started to write test, so maybe I
will find something that way. I've made some simplifications but as I do
translate javascript to smalltalk, I can't do exactly the same things,
and ....

Ok... made a new test, before to send this email, and in fact the
problem that I have and that does not appear in javascript is due to the
length of the links.
It seems that in D3, the node position is kinda relative (maybe
something with the window border, or something like that), but in Pharo,
its more 'static', so it needs to be chosen well for each graph.

Still need to be checked, but with a length of 20, in initialize, you
got a good result with Collection.

-----------------
| view rawView |
rawView := ROView new.
view := ROMondrianViewBuilder view: rawView.
"-------------"
"-------------"

ROEaselMorphic new populateMenuOn: view.
view open.

     view interaction on: ROMouseEnter do: [ :n |
         | nodes |
         nodes := view raw elementsFromModels: n element model
allSubclasses.
         ROHighlightElements on: nodes ].

     view interaction on: ROMouseLeave do: [ :n |
         | nodes |
         nodes := view raw elementsFromModels: n element model
allSubclasses.
         ROUnhighlightElements on: nodes  ].

     view shape rectangle size: 10.
     view nodes: (Collection  withAllSubclasses).
     view edgesFrom: #superclass.

     view layout: ROForceBasedLayout_N.
     view applyLayout.

-------------

Enjoy

Mathieu



_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.iam.unibe.ch/mailman/listinfo/moose-dev
Reply | Threaded
Open this post in threaded view
|

Re: Fwd: New ForceBasedLayout

Tudor Girba-2
Hi Mathieu,

Nice.

After a bit of a struggle, I managed to run your code :).

When you send code snippets make it easy for people to reproduce. The first thing you do is to tell people how to load code. In your case, you should have sent a snippet like this:

Gofer new 
smalltalkhubUser: 'MathieuDehouck' project: 'RoassalAlgorithm';
package: 'RoassalForceBaseLayout';
load

After I loaded the code, I saw that you have committed two self halts :). I removed those, but still I see that I got a DNU concerning ROElement>>position:. I thought that this is simply another name for translateTo: so I modified a bit the code. And it finally worked :).

Now, the value of a force based layout comes from applying it to more complex graphs, not just trees. So, I played a bit. Here is an example (see the picture in the attachment):

view nodes: (1 to: 100).
view nodes: (1000 to: 1100).
view edgesFrom: [:x | x // 10].
view edgesFrom: #yourself to: [:x | x // 15 ].
view layout: ROForceBasedLayout_N new 

It was pretty fast, too. Nice job.

What I saw is that the layout tends to move the nodes away from the 0@0 axis. It would be cool if the layout would apply a correction at the end to move the whole graph towards 0@0.

Cheers,
Doru


On Apr 25, 2013, at 8:23 PM, mathieu <[hidden email]> wrote:


Hi

So I've been working on the forcebasedlayout for more than a week now,
here are some news.

I've translated the D3 code, and have implemented a new quadtree, the
mondrian one wasn't that compatible.

But, I have a problem, it seems there is no more bug in th code, but it
still doesn't do what is expected, so I read and read th D3 code and
don't find where are my mistakes. I've started to write test, so maybe I
will find something that way. I've made some simplifications but as I do
translate javascript to smalltalk, I can't do exactly the same things,
and ....

Ok... made a new test, before to send this email, and in fact the
problem that I have and that does not appear in javascript is due to the
length of the links.
It seems that in D3, the node position is kinda relative (maybe
something with the window border, or something like that), but in Pharo,
its more 'static', so it needs to be chosen well for each graph.

Still need to be checked, but with a length of 20, in initialize, you
got a good result with Collection.

-----------------
| view rawView |
rawView := ROView new.
view := ROMondrianViewBuilder view: rawView.
"-------------"
"-------------"

ROEaselMorphic new populateMenuOn: view.
view open.

   view interaction on: ROMouseEnter do: [ :n |
       | nodes |
       nodes := view raw elementsFromModels: n element model
allSubclasses.
       ROHighlightElements on: nodes ].

   view interaction on: ROMouseLeave do: [ :n |
       | nodes |
       nodes := view raw elementsFromModels: n element model
allSubclasses.
       ROUnhighlightElements on: nodes  ].

   view shape rectangle size: 10.
   view nodes: (Collection  withAllSubclasses).
   view edgesFrom: #superclass.

   view layout: ROForceBasedLayout_N.
   view applyLayout.

-------------

Enjoy

Mathieu



_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.iam.unibe.ch/mailman/listinfo/moose-dev

--
www.tudorgirba.com

"If you can't say why something is relevant, 
it probably isn't."


_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.iam.unibe.ch/mailman/listinfo/moose-dev
Reply | Threaded
Open this post in threaded view
|

Re: New ForceBasedLayout

abergel
I also had to rename #position: to #translateTo:

Indeed, this is a very nice result. This is a clear improvement over what we had so far: the old force based layout is highly broken.

Good job!

Cheers,
Alexandre


On Apr 25, 2013, at 4:04 PM, Tudor Girba <[hidden email]> wrote:

> Hi Mathieu,
>
> Nice.
>
> After a bit of a struggle, I managed to run your code :).
>
> When you send code snippets make it easy for people to reproduce. The first thing you do is to tell people how to load code. In your case, you should have sent a snippet like this:
>
> Gofer new
> smalltalkhubUser: 'MathieuDehouck' project: 'RoassalAlgorithm';
> package: 'RoassalForceBaseLayout';
> load
>
> After I loaded the code, I saw that you have committed two self halts :). I removed those, but still I see that I got a DNU concerning ROElement>>position:. I thought that this is simply another name for translateTo: so I modified a bit the code. And it finally worked :).
>
> Now, the value of a force based layout comes from applying it to more complex graphs, not just trees. So, I played a bit. Here is an example (see the picture in the attachment):
>
> view nodes: (1 to: 100).
> view nodes: (1000 to: 1100).
> view edgesFrom: [:x | x // 10].
> view edgesFrom: #yourself to: [:x | x // 15 ].
> view layout: ROForceBasedLayout_N new
>
> It was pretty fast, too. Nice job.
>
> What I saw is that the layout tends to move the nodes away from the 0@0 axis. It would be cool if the layout would apply a correction at the end to move the whole graph towards 0@0.
>
> Cheers,
> Doru
>
> <forceBased200Nodes.png>
>
> On Apr 25, 2013, at 8:23 PM, mathieu <[hidden email]> wrote:
>
>>
>> Hi
>>
>> So I've been working on the forcebasedlayout for more than a week now,
>> here are some news.
>>
>> I've translated the D3 code, and have implemented a new quadtree, the
>> mondrian one wasn't that compatible.
>>
>> But, I have a problem, it seems there is no more bug in th code, but it
>> still doesn't do what is expected, so I read and read th D3 code and
>> don't find where are my mistakes. I've started to write test, so maybe I
>> will find something that way. I've made some simplifications but as I do
>> translate javascript to smalltalk, I can't do exactly the same things,
>> and ....
>>
>> Ok... made a new test, before to send this email, and in fact the
>> problem that I have and that does not appear in javascript is due to the
>> length of the links.
>> It seems that in D3, the node position is kinda relative (maybe
>> something with the window border, or something like that), but in Pharo,
>> its more 'static', so it needs to be chosen well for each graph.
>>
>> Still need to be checked, but with a length of 20, in initialize, you
>> got a good result with Collection.
>>
>> -----------------
>> | view rawView |
>> rawView := ROView new.
>> view := ROMondrianViewBuilder view: rawView.
>> "-------------"
>> "-------------"
>>
>> ROEaselMorphic new populateMenuOn: view.
>> view open.
>>
>>    view interaction on: ROMouseEnter do: [ :n |
>>        | nodes |
>>        nodes := view raw elementsFromModels: n element model
>> allSubclasses.
>>        ROHighlightElements on: nodes ].
>>
>>    view interaction on: ROMouseLeave do: [ :n |
>>        | nodes |
>>        nodes := view raw elementsFromModels: n element model
>> allSubclasses.
>>        ROUnhighlightElements on: nodes  ].
>>
>>    view shape rectangle size: 10.
>>    view nodes: (Collection  withAllSubclasses).
>>    view edgesFrom: #superclass.
>>
>>    view layout: ROForceBasedLayout_N.
>>    view applyLayout.
>>
>> -------------
>>
>> Enjoy
>>
>> Mathieu
>>
>>
>>
>> _______________________________________________
>> Moose-dev mailing list
>> [hidden email]
>> https://www.iam.unibe.ch/mailman/listinfo/moose-dev
>
> --
> www.tudorgirba.com
>
> "If you can't say why something is relevant,
> it probably isn't."
>
> _______________________________________________
> Moose-dev mailing list
> [hidden email]
> https://www.iam.unibe.ch/mailman/listinfo/moose-dev

--
_,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:
Alexandre Bergel  http://www.bergel.eu
^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;.




_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.iam.unibe.ch/mailman/listinfo/moose-dev
Reply | Threaded
Open this post in threaded view
|

Re: New ForceBasedLayout

Tudor Girba-2
Agreed. I cannot wait to have it integrated :)

Doru


On Fri, Apr 26, 2013 at 3:20 PM, Alexandre Bergel <[hidden email]> wrote:
I also had to rename #position: to #translateTo:

Indeed, this is a very nice result. This is a clear improvement over what we had so far: the old force based layout is highly broken.

Good job!

Cheers,
Alexandre


On Apr 25, 2013, at 4:04 PM, Tudor Girba <[hidden email]> wrote:

> Hi Mathieu,
>
> Nice.
>
> After a bit of a struggle, I managed to run your code :).
>
> When you send code snippets make it easy for people to reproduce. The first thing you do is to tell people how to load code. In your case, you should have sent a snippet like this:
>
> Gofer new
>       smalltalkhubUser: 'MathieuDehouck' project: 'RoassalAlgorithm';
>       package: 'RoassalForceBaseLayout';
>       load
>
> After I loaded the code, I saw that you have committed two self halts :). I removed those, but still I see that I got a DNU concerning ROElement>>position:. I thought that this is simply another name for translateTo: so I modified a bit the code. And it finally worked :).
>
> Now, the value of a force based layout comes from applying it to more complex graphs, not just trees. So, I played a bit. Here is an example (see the picture in the attachment):
>
> view nodes: (1 to: 100).
> view nodes: (1000 to: 1100).
> view edgesFrom: [:x | x // 10].
> view edgesFrom: #yourself to: [:x | x // 15 ].
> view layout: ROForceBasedLayout_N new
>
> It was pretty fast, too. Nice job.
>
> What I saw is that the layout tends to move the nodes away from the 0@0 axis. It would be cool if the layout would apply a correction at the end to move the whole graph towards 0@0.
>
> Cheers,
> Doru
>
> <forceBased200Nodes.png>
>
> On Apr 25, 2013, at 8:23 PM, mathieu <[hidden email]> wrote:
>
>>
>> Hi
>>
>> So I've been working on the forcebasedlayout for more than a week now,
>> here are some news.
>>
>> I've translated the D3 code, and have implemented a new quadtree, the
>> mondrian one wasn't that compatible.
>>
>> But, I have a problem, it seems there is no more bug in th code, but it
>> still doesn't do what is expected, so I read and read th D3 code and
>> don't find where are my mistakes. I've started to write test, so maybe I
>> will find something that way. I've made some simplifications but as I do
>> translate javascript to smalltalk, I can't do exactly the same things,
>> and ....
>>
>> Ok... made a new test, before to send this email, and in fact the
>> problem that I have and that does not appear in javascript is due to the
>> length of the links.
>> It seems that in D3, the node position is kinda relative (maybe
>> something with the window border, or something like that), but in Pharo,
>> its more 'static', so it needs to be chosen well for each graph.
>>
>> Still need to be checked, but with a length of 20, in initialize, you
>> got a good result with Collection.
>>
>> -----------------
>> | view rawView |
>> rawView := ROView new.
>> view := ROMondrianViewBuilder view: rawView.
>> "-------------"
>> "-------------"
>>
>> ROEaselMorphic new populateMenuOn: view.
>> view open.
>>
>>    view interaction on: ROMouseEnter do: [ :n |
>>        | nodes |
>>        nodes := view raw elementsFromModels: n element model
>> allSubclasses.
>>        ROHighlightElements on: nodes ].
>>
>>    view interaction on: ROMouseLeave do: [ :n |
>>        | nodes |
>>        nodes := view raw elementsFromModels: n element model
>> allSubclasses.
>>        ROUnhighlightElements on: nodes  ].
>>
>>    view shape rectangle size: 10.
>>    view nodes: (Collection  withAllSubclasses).
>>    view edgesFrom: #superclass.
>>
>>    view layout: ROForceBasedLayout_N.
>>    view applyLayout.
>>
>> -------------
>>
>> Enjoy
>>
>> Mathieu
>>
>>
>>
>> _______________________________________________
>> Moose-dev mailing list
>> [hidden email]
>> https://www.iam.unibe.ch/mailman/listinfo/moose-dev
>
> --
> www.tudorgirba.com
>
> "If you can't say why something is relevant,
> it probably isn't."
>
> _______________________________________________
> Moose-dev mailing list
> [hidden email]
> https://www.iam.unibe.ch/mailman/listinfo/moose-dev

--
_,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:
Alexandre Bergel  http://www.bergel.eu
^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;.




_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.iam.unibe.ch/mailman/listinfo/moose-dev



--

"Every thing has its own flow"

_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.iam.unibe.ch/mailman/listinfo/moose-dev
Reply | Threaded
Open this post in threaded view
|

Re: New ForceBasedLayout

stephane ducasse
In reply to this post by MathieuDehouck

On Apr 25, 2013, at 8:23 PM, mathieu <[hidden email]> wrote:

>
> Hi
>
> So I've been working on the forcebasedlayout for more than a week now,
> here are some news.
>
> I've translated the D3 code, and have implemented a new quadtree, the
> mondrian one wasn't that compatible.
>
> But, I have a problem, it seems there is no more bug in th code, but it
> still doesn't do what is expected, so I read and read th D3 code and
> don't find where are my mistakes. I've started to write test, so maybe I
> will find something that way. I've made some simplifications but as I do
> translate javascript to smalltalk, I can't do exactly the same things,
> and ….

mathieu may be you should grab nicolas Petton when he is back because he is a JS and Smalltalk expert.
So may be he can spot a glitch.

>
> Ok... made a new test, before to send this email, and in fact the
> problem that I have and that does not appear in javascript is due to the
> length of the links.
> It seems that in D3, the node position is kinda relative (maybe
> something with the window border, or something like that), but in Pharo,
> its more 'static', so it needs to be chosen well for each graph.
>
> Still need to be checked, but with a length of 20, in initialize, you
> got a good result with Collection.
>
> -----------------
> | view rawView |
> rawView := ROView new.
> view := ROMondrianViewBuilder view: rawView.
> "-------------"
> "-------------"
>
> ROEaselMorphic new populateMenuOn: view.
> view open.
>
>    view interaction on: ROMouseEnter do: [ :n |
>        | nodes |
>        nodes := view raw elementsFromModels: n element model
> allSubclasses.
>        ROHighlightElements on: nodes ].
>
>    view interaction on: ROMouseLeave do: [ :n |
>        | nodes |
>        nodes := view raw elementsFromModels: n element model
> allSubclasses.
>        ROUnhighlightElements on: nodes  ].
>
>    view shape rectangle size: 10.
>    view nodes: (Collection  withAllSubclasses).
>    view edgesFrom: #superclass.
>
>    view layout: ROForceBasedLayout_N.
>    view applyLayout.
>
> -------------
>
> Enjoy
>
> Mathieu
>
>
>
> _______________________________________________
> Moose-dev mailing list
> [hidden email]
> https://www.iam.unibe.ch/mailman/listinfo/moose-dev


_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.iam.unibe.ch/mailman/listinfo/moose-dev
Reply | Threaded
Open this post in threaded view
|

Re: New ForceBasedLayout

stephane ducasse
In reply to this post by Tudor Girba-2
:)

I'm happy that mathieu picked up this topic and that he gets such impact.
Too bad that he will be continuing a master somewhere else :)

Stef

Agreed. I cannot wait to have it integrated :)

Doru


On Fri, Apr 26, 2013 at 3:20 PM, Alexandre Bergel <[hidden email]> wrote:
I also had to rename #position: to #translateTo:

Indeed, this is a very nice result. This is a clear improvement over what we had so far: the old force based layout is highly broken.

Good job!

Cheers,
Alexandre


On Apr 25, 2013, at 4:04 PM, Tudor Girba <[hidden email]> wrote:

> Hi Mathieu,
>
> Nice.
>
> After a bit of a struggle, I managed to run your code :).
>
> When you send code snippets make it easy for people to reproduce. The first thing you do is to tell people how to load code. In your case, you should have sent a snippet like this:
>
> Gofer new
>       smalltalkhubUser: 'MathieuDehouck' project: 'RoassalAlgorithm';
>       package: 'RoassalForceBaseLayout';
>       load
>
> After I loaded the code, I saw that you have committed two self halts :). I removed those, but still I see that I got a DNU concerning ROElement>>position:. I thought that this is simply another name for translateTo: so I modified a bit the code. And it finally worked :).
>
> Now, the value of a force based layout comes from applying it to more complex graphs, not just trees. So, I played a bit. Here is an example (see the picture in the attachment):
>
> view nodes: (1 to: 100).
> view nodes: (1000 to: 1100).
> view edgesFrom: [:x | x // 10].
> view edgesFrom: #yourself to: [:x | x // 15 ].
> view layout: ROForceBasedLayout_N new
>
> It was pretty fast, too. Nice job.
>
> What I saw is that the layout tends to move the nodes away from the 0@0 axis. It would be cool if the layout would apply a correction at the end to move the whole graph towards 0@0.
>
> Cheers,
> Doru
>
> <forceBased200Nodes.png>
>
> On Apr 25, 2013, at 8:23 PM, mathieu <[hidden email]> wrote:
>
>>
>> Hi
>>
>> So I've been working on the forcebasedlayout for more than a week now,
>> here are some news.
>>
>> I've translated the D3 code, and have implemented a new quadtree, the
>> mondrian one wasn't that compatible.
>>
>> But, I have a problem, it seems there is no more bug in th code, but it
>> still doesn't do what is expected, so I read and read th D3 code and
>> don't find where are my mistakes. I've started to write test, so maybe I
>> will find something that way. I've made some simplifications but as I do
>> translate javascript to smalltalk, I can't do exactly the same things,
>> and ....
>>
>> Ok... made a new test, before to send this email, and in fact the
>> problem that I have and that does not appear in javascript is due to the
>> length of the links.
>> It seems that in D3, the node position is kinda relative (maybe
>> something with the window border, or something like that), but in Pharo,
>> its more 'static', so it needs to be chosen well for each graph.
>>
>> Still need to be checked, but with a length of 20, in initialize, you
>> got a good result with Collection.
>>
>> -----------------
>> | view rawView |
>> rawView := ROView new.
>> view := ROMondrianViewBuilder view: rawView.
>> "-------------"
>> "-------------"
>>
>> ROEaselMorphic new populateMenuOn: view.
>> view open.
>>
>>    view interaction on: ROMouseEnter do: [ :n |
>>        | nodes |
>>        nodes := view raw elementsFromModels: n element model
>> allSubclasses.
>>        ROHighlightElements on: nodes ].
>>
>>    view interaction on: ROMouseLeave do: [ :n |
>>        | nodes |
>>        nodes := view raw elementsFromModels: n element model
>> allSubclasses.
>>        ROUnhighlightElements on: nodes  ].
>>
>>    view shape rectangle size: 10.
>>    view nodes: (Collection  withAllSubclasses).
>>    view edgesFrom: #superclass.
>>
>>    view layout: ROForceBasedLayout_N.
>>    view applyLayout.
>>
>> -------------
>>
>> Enjoy
>>
>> Mathieu
>>
>>
>>
>> _______________________________________________
>> Moose-dev mailing list
>> [hidden email]
>> https://www.iam.unibe.ch/mailman/listinfo/moose-dev
>
> --
> www.tudorgirba.com
>
> "If you can't say why something is relevant,
> it probably isn't."
>
> _______________________________________________
> Moose-dev mailing list
> [hidden email]
> https://www.iam.unibe.ch/mailman/listinfo/moose-dev

--
_,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:
Alexandre Bergel  http://www.bergel.eu
^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;.




_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.iam.unibe.ch/mailman/listinfo/moose-dev



--

"Every thing has its own flow"
_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.iam.unibe.ch/mailman/listinfo/moose-dev


_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.iam.unibe.ch/mailman/listinfo/moose-dev