Smalltalk › Frameworks & Tools › Moose

Visual indicator

‹ Previous Topic Next Topic ›
 
classic Classic list List threaded Threaded
♦
♦
 6 messages Options
Alexandre Bergel-5
Reply | Threaded
Open this post in threaded view
♦
♦
|

Visual indicator

Alexandre Bergel-5
I found this indicator in a magazine and I kind of like it, even if I am not sure how useful it is in practice :-)





-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
"Visual indicator"

| element allElements metrics shape normalizer |

"Data"
metrics := {#numberOfAttributes . #numberOfMethods . #numberOfAttributesInherited . #numberOfMethodsInherited}.
element := MORectangleShape.
allElements := MOShape withAllSubclasses sortedAs: #name.

"Visualization"
view shape rectangle withoutBorder.
view nodes: metrics forEach: [ :selector |
        | t index |
        t := (allElements sortedAs: selector) reverse.
        view shape label fontColor: Color red.
        view interaction forwarder.
        view node: selector.
       
        index := (t indexOf: element).

        "The first three elements"
        view shape rectangle withoutBorder.
        view interaction forwarder.
       
        "Color of the circle"
        normalizer := MONColorLinearNormalizer
                                                                inContext: t
                                                                withCommand: [:v | v perform: selector]
                                                                lowColor: Color veryLightGray
                                                                highColor: Color black.
        view node: selector forIt: [
                (t copyFrom: 1 to: (4 min: index) - 1) do: [:c |
                       
                        view shape rectangle withoutBorder.
                        view node: (c perform: selector) forIt: [
                                view shape ellipse size: 10; withoutBorder;
                                        fillColor:  normalizer.
                                view interaction forwarder.
                                view node: c.
                               
                                view shape label.
                                view node: (t indexOf: c) printString, '.', c name.
                        ].
                        view verticalLineLayout gapSize: 0.
                ] ].

        "The remaining"
        view shape rectangle withoutBorder.
        view node: selector forIt: [
                (t copyFrom: 4 to: index - 1) do: [:c |
                        view shape ellipse size: 10; withoutBorder;
                                                        fillColor:  normalizer.
                        view node: c.
                ].
       
                view shape ellipse size: 10; fillColor: Color red; withoutBorder.
                view node: element.
               
                view shape label.
                view node: index printString, '.', element printString.

                view gridLayout
        ].
        view verticalLineLayout gapSize: 0
].
view horizontalLineLayout gapSize: 20.
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
--
_,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:
Alexandre Bergel  http://www.bergel.eu
^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;.






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

VisualIndicator.png (14K) Download Attachment
Nicolas Anquetil
Reply | Threaded
Open this post in threaded view
♦
♦
|

Re: Visual indicator

Nicolas Anquetil

hummmm
I don't know.
Could not figure out what it means.

nicolas

----- Mail original -----

> De: "Alexandre Bergel" <[hidden email]>
> À: "Moose-related development" <[hidden email]>
> Envoyé: Lundi 27 Juin 2011 23:37:58
> Objet: [Moose-dev] Visual indicator
> I found this indicator in a magazine and I kind of like it, even if I
> am not sure how useful it is in practice :-)
>
>
>
>
> [image/png:VisualIndicator.png]
>
>
>
> -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
> "Visual indicator"
>
> | element allElements metrics shape normalizer |
>
> "Data"
> metrics := {#numberOfAttributes . #numberOfMethods .
> #numberOfAttributesInherited . #numberOfMethodsInherited}.
> element := MORectangleShape.
> allElements := MOShape withAllSubclasses sortedAs: #name.
>
> "Visualization"
> view shape rectangle withoutBorder.
> view nodes: metrics forEach: [ :selector |
> | t index |
> t := (allElements sortedAs: selector) reverse.
> view shape label fontColor: Color red.
> view interaction forwarder.
> view node: selector.
>
> index := (t indexOf: element).
>
> "The first three elements"
> view shape rectangle withoutBorder.
> view interaction forwarder.
>
> "Color of the circle"
> normalizer := MONColorLinearNormalizer
> inContext: t
> withCommand: [:v | v perform: selector]
> lowColor: Color veryLightGray
> highColor: Color black.
> view node: selector forIt: [
> (t copyFrom: 1 to: (4 min: index) - 1) do: [:c |
>
> view shape rectangle withoutBorder.
> view node: (c perform: selector) forIt: [
> view shape ellipse size: 10; withoutBorder;
> fillColor: normalizer.
> view interaction forwarder.
> view node: c.
>
> view shape label.
> view node: (t indexOf: c) printString, '.', c name.
> ].
> view verticalLineLayout gapSize: 0.
> ] ].
>
> "The remaining"
> view shape rectangle withoutBorder.
> view node: selector forIt: [
> (t copyFrom: 4 to: index - 1) do: [:c |
> view shape ellipse size: 10; withoutBorder;
> fillColor: normalizer.
> view node: c.
> ].
>
> view shape ellipse size: 10; fillColor: Color red; withoutBorder.
> view node: element.
>
> view shape label.
> view node: index printString, '.', element printString.
>
> view gridLayout
> ].
> view verticalLineLayout gapSize: 0
> ].
> view horizontalLineLayout gapSize: 20.
> -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
> --
> _,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:
> Alexandre Bergel http://www.bergel.eu
> ^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;.
>
>
>
>
>
>
> _______________________________________________
> 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
abergel
Reply | Threaded
Open this post in threaded view
♦
♦
|

Re: Visual indicator

abergel
> Could not figure out what it means.




The visualization focuses on the class MORectangleShape. The class is ranked #18 against the numberOfAttributes metric. The circle's gray intensity is shows the difference between other classes. The class MOBoundedShape has much more attributes than other classes.

Alexandre

>
> nicolas
>
> ----- Mail original -----
>> De: "Alexandre Bergel" <[hidden email]>
>> À: "Moose-related development" <[hidden email]>
>> Envoyé: Lundi 27 Juin 2011 23:37:58
>> Objet: [Moose-dev] Visual indicator
>> I found this indicator in a magazine and I kind of like it, even if I
>> am not sure how useful it is in practice :-)
>>
>>
>>
>>
>> [image/png:VisualIndicator.png]
>>
>>
>>
>> -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
>> "Visual indicator"
>>
>> | element allElements metrics shape normalizer |
>>
>> "Data"
>> metrics := {#numberOfAttributes . #numberOfMethods .
>> #numberOfAttributesInherited . #numberOfMethodsInherited}.
>> element := MORectangleShape.
>> allElements := MOShape withAllSubclasses sortedAs: #name.
>>
>> "Visualization"
>> view shape rectangle withoutBorder.
>> view nodes: metrics forEach: [ :selector |
>> | t index |
>> t := (allElements sortedAs: selector) reverse.
>> view shape label fontColor: Color red.
>> view interaction forwarder.
>> view node: selector.
>>
>> index := (t indexOf: element).
>>
>> "The first three elements"
>> view shape rectangle withoutBorder.
>> view interaction forwarder.
>>
>> "Color of the circle"
>> normalizer := MONColorLinearNormalizer
>> inContext: t
>> withCommand: [:v | v perform: selector]
>> lowColor: Color veryLightGray
>> highColor: Color black.
>> view node: selector forIt: [
>> (t copyFrom: 1 to: (4 min: index) - 1) do: [:c |
>>
>> view shape rectangle withoutBorder.
>> view node: (c perform: selector) forIt: [
>> view shape ellipse size: 10; withoutBorder;
>> fillColor: normalizer.
>> view interaction forwarder.
>> view node: c.
>>
>> view shape label.
>> view node: (t indexOf: c) printString, '.', c name.
>> ].
>> view verticalLineLayout gapSize: 0.
>> ] ].
>>
>> "The remaining"
>> view shape rectangle withoutBorder.
>> view node: selector forIt: [
>> (t copyFrom: 4 to: index - 1) do: [:c |
>> view shape ellipse size: 10; withoutBorder;
>> fillColor: normalizer.
>> view node: c.
>> ].
>>
>> view shape ellipse size: 10; fillColor: Color red; withoutBorder.
>> view node: element.
>>
>> view shape label.
>> view node: index printString, '.', element printString.
>>
>> view gridLayout
>> ].
>> view verticalLineLayout gapSize: 0
>> ].
>> view horizontalLineLayout gapSize: 20.
>> -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
>> --
>> _,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:
>> Alexandre Bergel http://www.bergel.eu
>> ^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;.
>>
>>
>>
>>
>>
>>
>> _______________________________________________
>> 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
--
_,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:
Alexandre Bergel  http://www.bergel.eu
^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;.






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

VisualIndicator.png (14K) Download Attachment
Stéphane Ducasse
Reply | Threaded
Open this post in threaded view
♦
♦
|

Re: Visual indicator

Stéphane Ducasse
In reply to this post by Alexandre Bergel-5
how do we read that?

Stef

On Jun 27, 2011, at 11:37 PM, Alexandre Bergel wrote:

> I found this indicator in a magazine and I kind of like it, even if I am not sure how useful it is in practice :-)
>
>
> <VisualIndicator.png>
>
> -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
> "Visual indicator"
>
> | element allElements metrics shape normalizer |
>
> "Data"
> metrics := {#numberOfAttributes . #numberOfMethods . #numberOfAttributesInherited . #numberOfMethodsInherited}.
> element := MORectangleShape.
> allElements := MOShape withAllSubclasses sortedAs: #name.
>
> "Visualization"
> view shape rectangle withoutBorder.
> view nodes: metrics forEach: [ :selector |
> | t index |
> t := (allElements sortedAs: selector) reverse.
> view shape label fontColor: Color red.
> view interaction forwarder.
> view node: selector.
>
> index := (t indexOf: element).
>
> "The first three elements"
> view shape rectangle withoutBorder.
> view interaction forwarder.
>
> "Color of the circle"
> normalizer := MONColorLinearNormalizer
> inContext: t
> withCommand: [:v | v perform: selector]
> lowColor: Color veryLightGray
> highColor: Color black.
> view node: selector forIt: [
> (t copyFrom: 1 to: (4 min: index) - 1) do: [:c |
>
> view shape rectangle withoutBorder.
> view node: (c perform: selector) forIt: [
> view shape ellipse size: 10; withoutBorder;
> fillColor:  normalizer.
> view interaction forwarder.
> view node: c.
>
> view shape label.
> view node: (t indexOf: c) printString, '.', c name.
> ].
> view verticalLineLayout gapSize: 0.
> ] ].
>
> "The remaining"
> view shape rectangle withoutBorder.
> view node: selector forIt: [
> (t copyFrom: 4 to: index - 1) do: [:c |
> view shape ellipse size: 10; withoutBorder;
> fillColor:  normalizer.
> view node: c.
> ].
>
> view shape ellipse size: 10; fillColor: Color red; withoutBorder.
> view node: element.
>
> view shape label.
> view node: index printString, '.', element printString.
>
> view gridLayout
> ].
> view verticalLineLayout gapSize: 0
> ].
> view horizontalLineLayout gapSize: 20.
> -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
> --
> _,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:
> Alexandre Bergel  http://www.bergel.eu
> ^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;.
>
>
>
>
>
> _______________________________________________
> 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
Tudor Girba-2
Reply | Threaded
Open this post in threaded view
♦
♦
|

Re: Visual indicator

Tudor Girba-2
In reply to this post by abergel
It's quite interesting.

But, on another note, I think this is a good example of the mismatch between the picture and the Mondrian script. The picture looks good. But, the problem is that the script does not map the model on it nicely.

You can see that because of several reasons:
- you are using a standalone node for the selectors. Conceptually, it should be a node around the complete box that should have a complex shape with a title on top.
- similarly, you are using two nodes for the top 3 and for the target entity: one for the circle and one for the label. Conceptually, they should be the same node displayed with a complex shape.

The code would reveal the intention better (also some of the layout definition would go away).

Mondrian is not a drawing engine, but a transformation engine that should map your model on the picture as straightforward as possible. We should try to create higher level predicates whenever we cannot express what we want.

Cheers,
Doru


On 28 Jun 2011, at 11:37, Alexandre Bergel wrote:

>> Could not figure out what it means.
>
> <VisualIndicator.png>
>
> The visualization focuses on the class MORectangleShape. The class is ranked #18 against the numberOfAttributes metric. The circle's gray intensity is shows the difference between other classes. The class MOBoundedShape has much more attributes than other classes.
>
> Alexandre
>
>>
>> nicolas
>>
>> ----- Mail original -----
>>> De: "Alexandre Bergel" <[hidden email]>
>>> À: "Moose-related development" <[hidden email]>
>>> Envoyé: Lundi 27 Juin 2011 23:37:58
>>> Objet: [Moose-dev] Visual indicator
>>> I found this indicator in a magazine and I kind of like it, even if I
>>> am not sure how useful it is in practice :-)
>>>
>>>
>>>
>>>
>>> [image/png:VisualIndicator.png]
>>>
>>>
>>>
>>> -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
>>> "Visual indicator"
>>>
>>> | element allElements metrics shape normalizer |
>>>
>>> "Data"
>>> metrics := {#numberOfAttributes . #numberOfMethods .
>>> #numberOfAttributesInherited . #numberOfMethodsInherited}.
>>> element := MORectangleShape.
>>> allElements := MOShape withAllSubclasses sortedAs: #name.
>>>
>>> "Visualization"
>>> view shape rectangle withoutBorder.
>>> view nodes: metrics forEach: [ :selector |
>>> | t index |
>>> t := (allElements sortedAs: selector) reverse.
>>> view shape label fontColor: Color red.
>>> view interaction forwarder.
>>> view node: selector.
>>>
>>> index := (t indexOf: element).
>>>
>>> "The first three elements"
>>> view shape rectangle withoutBorder.
>>> view interaction forwarder.
>>>
>>> "Color of the circle"
>>> normalizer := MONColorLinearNormalizer
>>> inContext: t
>>> withCommand: [:v | v perform: selector]
>>> lowColor: Color veryLightGray
>>> highColor: Color black.
>>> view node: selector forIt: [
>>> (t copyFrom: 1 to: (4 min: index) - 1) do: [:c |
>>>
>>> view shape rectangle withoutBorder.
>>> view node: (c perform: selector) forIt: [
>>> view shape ellipse size: 10; withoutBorder;
>>> fillColor: normalizer.
>>> view interaction forwarder.
>>> view node: c.
>>>
>>> view shape label.
>>> view node: (t indexOf: c) printString, '.', c name.
>>> ].
>>> view verticalLineLayout gapSize: 0.
>>> ] ].
>>>
>>> "The remaining"
>>> view shape rectangle withoutBorder.
>>> view node: selector forIt: [
>>> (t copyFrom: 4 to: index - 1) do: [:c |
>>> view shape ellipse size: 10; withoutBorder;
>>> fillColor: normalizer.
>>> view node: c.
>>> ].
>>>
>>> view shape ellipse size: 10; fillColor: Color red; withoutBorder.
>>> view node: element.
>>>
>>> view shape label.
>>> view node: index printString, '.', element printString.
>>>
>>> view gridLayout
>>> ].
>>> view verticalLineLayout gapSize: 0
>>> ].
>>> view horizontalLineLayout gapSize: 20.
>>> -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
>>> --
>>> _,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:
>>> Alexandre Bergel http://www.bergel.eu
>>> ^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;.
>>>
>>>
>>>
>>>
>>>
>>>
>>> _______________________________________________
>>> 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
>
> --
> _,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:
> Alexandre Bergel  http://www.bergel.eu
> ^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;.
>
>
>
>
>
> _______________________________________________
> Moose-dev mailing list
> [hidden email]
> https://www.iam.unibe.ch/mailman/listinfo/moose-dev

--
www.tudorgirba.com

"Every now and then stop and ask yourself if the war you're fighting is the right one."




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

Re: Visual indicator

abergel
In reply to this post by Stéphane Ducasse
I just replied to Nicolas

Alexandre


On 28 Jun 2011, at 11:56, Stéphane Ducasse wrote:

> how do we read that?
>
> Stef
>
> On Jun 27, 2011, at 11:37 PM, Alexandre Bergel wrote:
>
>> I found this indicator in a magazine and I kind of like it, even if I am not sure how useful it is in practice :-)
>>
>>
>> <VisualIndicator.png>
>>
>> -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
>> "Visual indicator"
>>
>> | element allElements metrics shape normalizer |
>>
>> "Data"
>> metrics := {#numberOfAttributes . #numberOfMethods . #numberOfAttributesInherited . #numberOfMethodsInherited}.
>> element := MORectangleShape.
>> allElements := MOShape withAllSubclasses sortedAs: #name.
>>
>> "Visualization"
>> view shape rectangle withoutBorder.
>> view nodes: metrics forEach: [ :selector |
>> | t index |
>> t := (allElements sortedAs: selector) reverse.
>> view shape label fontColor: Color red.
>> view interaction forwarder.
>> view node: selector.
>>
>> index := (t indexOf: element).
>>
>> "The first three elements"
>> view shape rectangle withoutBorder.
>> view interaction forwarder.
>>
>> "Color of the circle"
>> normalizer := MONColorLinearNormalizer
>> inContext: t
>> withCommand: [:v | v perform: selector]
>> lowColor: Color veryLightGray
>> highColor: Color black.
>> view node: selector forIt: [
>> (t copyFrom: 1 to: (4 min: index) - 1) do: [:c |
>>
>> view shape rectangle withoutBorder.
>> view node: (c perform: selector) forIt: [
>> view shape ellipse size: 10; withoutBorder;
>> fillColor:  normalizer.
>> view interaction forwarder.
>> view node: c.
>>
>> view shape label.
>> view node: (t indexOf: c) printString, '.', c name.
>> ].
>> view verticalLineLayout gapSize: 0.
>> ] ].
>>
>> "The remaining"
>> view shape rectangle withoutBorder.
>> view node: selector forIt: [
>> (t copyFrom: 4 to: index - 1) do: [:c |
>> view shape ellipse size: 10; withoutBorder;
>> fillColor:  normalizer.
>> view node: c.
>> ].
>>
>> view shape ellipse size: 10; fillColor: Color red; withoutBorder.
>> view node: element.
>>
>> view shape label.
>> view node: index printString, '.', element printString.
>>
>> view gridLayout
>> ].
>> view verticalLineLayout gapSize: 0
>> ].
>> view horizontalLineLayout gapSize: 20.
>> -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
>> --
>> _,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:
>> Alexandre Bergel  http://www.bergel.eu
>> ^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;.
>>
>>
>>
>>
>>
>> _______________________________________________
>> 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

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






_______________________________________________
Moose-dev mailing list
[hidden email]
https://www.iam.unibe.ch/mailman/listinfo/moose-dev
Free forum by Nabble Edit this page