objectprofile / roassal3 Goto Github PK
View Code? Open in Web Editor NEWThe Roassal Visualization Engine
License: MIT License
The Roassal Visualization Engine
License: MIT License
We have TSLine
, we can create subclasses of TSLine
How can we have this example from Roassal2
| b lb |
b := RTMondrian new.
b shape circle color: (Color red alpha: 0.4).
b nodes: Collection withAllSubclasses.
b edges connectFrom: #superclass.
b shape bezierLineFollowing: #superclass; color: (Color blue alpha: 0.1).
b edges
notUseInLayout;
connectToAll: #dependentClasses.
b normalizer
normalizeSize: #numberOfMethods min: 5 max: 50.
b layout force.
b build.
lb := RTLegendBuilder new.
lb view: b view.
lb addText: 'Circle = classes, size = number of methods; gray links = inheritance;'.
lb addText: 'blue links = dependencies; layout = force based layout on the inheritance links'.
lb build.
^ b view @ RTZoomableView.
The user doesn't need to see more details on a UML class. Also, given inertia zoom in in Mac is tricky...
This requires that also zoomToFit doesn't goo beyond this zoom limit... should i create a separate issue?
v := RSView new.
"v showEncompassingRectangles."
s := RSShapeBuilder composite
color: Color blue;
interactionDo: #draggable;
shapes: [ :cls |
| ss lbl |
ss := RSShapeBuilder box
interactionDo: #popup;
size: #linesOfCode;
elementsOn: (cls methods).
RSGridLayout on: ss.
lbl := RSShapeBuilder label elementOn: cls name.
"TSConstraint move: lbl above: ss."
ss, (TSGroup with: lbl)
];
onElement;
extent: [ :anElement | anElement extent + (10 @ 10) ];
elementsOn: (Collection withAllSubclasses).
v addAll: s.
RSEdgeBuilder line
view: v;
objects: Collection withAllSubclasses;
connectFrom: #superclass.
RSGridLayout on: s.
v @ RSControlsView.
v open
Edges get updated only when I drag and drop nesting packages.
The following example fail with the popup on edges:
packagesRegExp := { 'Calypso*' }.
packages := packagesRegExp flatCollect: [ :regExp | RPackageOrganizer default packages select: [ :p | regExp match: p packageName ] ].
l := RSLabeled new text: [ :e | e model packageName ].
packageElements := RSShapeBuilder composite
color: Color blue trans;
addInteraction: l;
draggable;
shapes: [ :pak |
| g lbl |
g := RSShapeBuilder box
size: [ :cls | cls numberOfMethods sqrt ];
elementsOn: pak definedClasses.
RSGridLayout on: g.
g
];
padding: 5;
elementsOn: packages.
packageElements @ RSHighlightable new withEdges.
v := RSView new.
v addAll: packageElements.
RSEdgeBuilder bimetricLine
view: v;
objects: packages;
widthFrom:
[ :edge | (edge key model numberOfDependenciesToward: edge value model) sqrt * 10 ];
widthTo:
[ :edge | (edge value model numberOfDependenciesToward: edge key model) sqrt * 10 ];
paint: Color red trans;
border: nil;
withBorderAttachPoint;
connectFrom: #yourself toAll: #dependentPackages.
RSWeightedCircleLayout new initialRadius: 300; on: packageElements.
v @ RSControlsView.
v open
We need to have branches...
Current state
view := RSView new.
....
box when: TSTranslationShapeEvent do: [:evt | ... ].
view when: TSResizeCanvasEvent do: [ :evt | pie view zoomToFit ].
I think that we have long names for these events, may be we can use
box when: #positionChanged do: [:evt | ... ].
view when: #extentChanged do: [ :evt | pie view zoomToFit ].
Should an edge be aware of whether it is part of layout or not?
v := RSView new.
v showEncompassingRectangles.
s := RSShapeBuilder composite
color: Color blue;
interactionDo: #draggable;
shapes: [ :cls |
| ss lbl |
ss := RSShapeBuilder box
interactionDo: #popup;
size: #linesOfCode;
elementsOn: (cls methods).
RSGridLayout on: ss.
lbl := RSShapeBuilder label elementOn: cls name.
"TSConstraint move: lbl above: ss."
ss, (TSGroup with: lbl)
];
onElement;
extent: [ :anElement | anElement extent + (10 @ 10) ];
elementsOn: (Collection withAllSubclasses).
v addAll: s.
RSEdgeBuilder line
view: v;
objects: Collection withAllSubclasses;
connectFrom: #superclass.
RSTreeLayout on: s.
v @ RSControlsView.
v open
How can we handle the inspector if glamour is going to be obsolete
It's not practical that when you collapse a class, it moves position and then you have to move mouse to expand it again. Also it breaks layout.
How do we handle rotation? At the top, in a matrix in TSShape
?
In that case, we would not need to have a TSRotatedLabel
Consider the script:
classes := Collection withAllSubclasses.
v := RSView new.
shape := RSShapeBuilder box
popup;
width: [ :cls | cls instVarNames size * 5 max: 5 ];
height: [ :cls | cls numberOfMethods max: 5 ].
elements := shape elementsOn: classes.
v addAll: elements.
RSEdgeBuilder line
view: v;
objects: classes;
withVerticalAttachPoint;
connectFrom: #superclass.
RSTreeLayout on: elements.
RSInspectable reset.
inspectable := RSInspectable new .
highligtable := inspectable highlightable.
highligtable highlightShape color: Color green.
inspectable inspectElementBlock: [ :cls |
| builder |
builder := RSUMLClassBuilder new.
builder classes: { cls }.
builder build.
builder open
].
elements @ inspectable.
v @ RSControlsView.
v open
Times to time, the legend raises an error.
Create the roassal3 menu with these items
objects := TSShape withAllSubclasses.
v := RSView new.
v showEncompassingRectangles.
n := TSScale category20c.
shape := RSShapeBuilder box color: n; size: [ : c | c numberOfMethods ].
es := shape elementsOn: objects.
v addAll: es.
RSHorizontalLineLayout new gapSize: 0; on: es.
RTAlignment new elements: es; bottom.
v @ RSControlsView.
v open
Currently, if I wish to have a menu for an element, I need to do
v := RSView new.
boxes := RSShapeBuilder composite
color: Color blue trans;
shapes: [ :nb |
TSGroup with: (RSShapeBuilder label elementOn: nb)
];
size: 30;
elementsOn: (1 to: 100).
v addAll: boxes.
RSGridLayout on: boxes.
boxes do: [ :b |
b @ (RSMenuActivable new menuDo: [ :menu | menu add: 'Inspect' target: b selector: #inspect argument: #() ])
].
"boxes @ (RSMenuActivable new menuDo: [ :menu | menu add: 'Inspect' target: )"
v @ RSControlsView.
v open
Would be nice to do:
boxes @ (RSMenuActivable new menuDo: [ :menu :element | menu add: 'Inspect' target: element ...
Here is a starting point
If I do RSEdgeBuilder line foo
I have no error. That cannot be. A does not understand error should be raised
In Roassal2 we have:
| v es |
v := RTView new.
es := RTBox new size: 20; color: Color blue; elementsOn: #('Hello' 'World').
v addAll: es.
RTHorizontalLineLayout on: es.
es do: [ :e |
e @ (RTLabeled new color: Color red; setAsHighlightable) ].
es @ RTDraggable.
v
Roassal3 needs to run over sparta.
is Roassal3 going to work over bloc?
How to make the first window keep the focus ?
| classes v shape elements inspectable highligtable |
classes := Collection withAllSubclasses.
v := RSView new.
shape := RSShapeBuilder box
popup;
width: [ :cls | cls instVarNames size * 5 max: 5 ];
height: [ :cls | cls numberOfMethods max: 5 ].
elements := shape elementsOn: classes.
v addAll: elements.
RSEdgeBuilder line
view: v;
objects: classes;
withVerticalAttachPoint;
connectFrom: #superclass.
RSTreeLayout on: elements.
RSInspectable reset.
inspectable := RSInspectable new.
highligtable := inspectable highlightable.
highligtable highlightShape color: Color green.
inspectable
inspectElementBlock: [ :cls |
| builder |
builder := RSUMLClassBuilder new.
builder classes: {cls}.
builder build.
builder open ].
"inspectable inspectElementBlock: [ :cls | GTInspector openOn: cls ]."
elements @ inspectable.
v @ RSControlsView.
v open
v := RSView new.
ss := RSShapeBuilder box size: 30; element.
lbl := RSShapeBuilder label elementOn: 'hello'.
v add: ss.
v add: lbl.
RSAlignment new fixedElement: ss; elements: (TSGroup with: lbl); center.
v open
I would expect the label to be at the center of the fixed element, the box. But this is not the case:
The following code raises an error:
v := RSView new.
classElements := RSShapeBuilder composite
color: Color blue trans;
shapes: [ :obj |
| g |
g := RSShapeBuilder box elementsOn: obj methods.
RSGridLayout on: g.
g
]; padding: 5;
elementsOn: Collection withAllSubclasses.
RSGridLayout on: classElements.
v addAll: classElements.
v @ RSControlsView.
v open
And it should not apparently. When #padding:
is sent, the shapes
variable is nil
, and we did a shapes:
just before!
I created the package Roassal3-DSM
, imported from Roassal2.
I cannot have the top labels aligned.
Here is the code:
| dsm |
dsm := RSDSM new.
dsm objects: TSShape withAllSubclasses.
dsm dependency: #dependentClasses.
dsm build.
^ dsm open
Less important:
-Highlighter
Less less important:
We should have two hierarchies: one defining the visualization content (DOM), and another for the rendering structure, based on QuadTree
We need to do something like: TSConstraint move: lbl above: ss.
In particular, what are the edition options we can have for a visualization?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.