<< back to blog

yUML Direction Control and Scaling

yuml ~ uml ~ misc

23 May, 2009

I really need to give yUML it’s own blog or news page or something :)

Until then, a few things that are new with yUML.

Class Diagram Direction Control

By default, class diagrams switch from horizontal layout to vertical if there are 4 or more classes in the diagram. If you don’t want this behavior, you can override it by tweaking the URL adding a dir:lr or dir:td, where td is Top Down and lr is Left Right. Example of use:

http://yuml.me/diagram/scruffy;dir:lr/class/[Customer]+1->*[Order], [Order]++1-items >*[LineItem], [Order]-0..1>[PaymentMethod], [PaymentMethod]^[Card], [PaymentMethod]^[Cash], [PaymentMethod]^[Cheque].

Diagram Scaling

Sometimes you want a bigger or smaller diagram. yUML lets you do this if you add a scale:120 to the image URL (120 being the % size you want to scale). Here’s an example

http://yuml.me/diagram/scruffy;scale:200/class/[Customer]+1->*[Order]
yUML Scaling

Another example is this:

http://yuml.me/diagram/scruffy;dir:lr;scale:75/class/[Customer]+1->*[Order], [Order]++1-items >*[LineItem], [Order]-0..1>[PaymentMethod], [PaymentMethod]^[Card], [PaymentMethod]^[Cash], [PaymentMethod]^[Cheque].
yUML Direction Control

Combining

You can combine these effects to make some interesting diagrams, here’s how you might bolt together an org chart.

http://yuml.me/diagram/plain;scale:200;dir:td/class/My Company{bg:green}->Research{bg:yellow}, My Company->Marketing{bg:lightblue}, My Company->Sales{bg:orange}, Sales-note:Outsourced to Blah inc

Enjoy!

You may also like...
Want to be involved with yUML?
Blowing Bubbles With Twitter (And Bursting Them!)
PDF Output With yUML, And Other Things...
yUML Direction Control and Scaling
yUML Diagrams Look Cool On GitHub
yUML Scruffy Hand Drawn Look
A Touch Of Polish for yUML
yUML and jQuery for Large Diagrams
yUML - For NOT Sketching UML Diagrams Online!

kick it on DotNetKicks.com
blog comments powered by Disqus