Red Black Tree Visualization using HTML5 Canvas and GWT

I created a sample app that demonstrates HTML5 Canvas usage from Java through GWT. I think GWT is an excellent tool for migrating desktop apps into Web nowadays, especially for Java developers. So it’s worth giving it a try. Google has made significant progress on migrating desktop apps into Web during the last year. They propagated trend for HTML5 support and Javascript JIT compilers among modern browsers. So it’s possible to run Quake 2 or CAD software directly in browser at decent speed. Red Black Tree is a balanced BST tree. Details are described on Wikipedia. You can run this sample app directly on appspot (it works on iPhone too :-) ) Sample code can be found here: Browse on GitHub. Let’s start from initialization. First, we need to create Canvas element and add it to HTML. getContext2D is called to obtain drawing context. We register a timer to redraw frames frequently: So doUpdate is called every 50 ms and whenever redrawFrame is set to true, it redraws Canvas contents. In autoplay mode, we call processFrame in while loop. So whenever redraw procedure takes too long, we will process frames without redrawing them. This won’t slow down animation on low resources. Then, we need to draw a tree. We use drawTree procedure, which is recursive and draws nodes along with contents and connections between them: The best part is that we can do regular Java unit tests on Red Black tree to verify the correctness of implementation:

You May Also Like

Mentoring in Software Craftsmanship

Maria Diaconu and  Alexandru Bolboaca are both strong supporters of Software Craftsmanship and Agile movements in Romania, with years of experience as developers, leaders, architects, managers and instructors. On their lecture at Agile Central Eur...Maria Diaconu and  Alexandru Bolboaca are both strong supporters of Software Craftsmanship and Agile movements in Romania, with years of experience as developers, leaders, architects, managers and instructors. On their lecture at Agile Central Eur...

HISE home page

Apache HISE has recenlty kickstarted and has a home page here: http://incubator.apache.org/hise/index.html.Apache HISE is Human Interactions Service Engine. It's an open source implementation of WS HumanTask specification.HISE proposal can be found her...Apache HISE has recenlty kickstarted and has a home page here: http://incubator.apache.org/hise/index.html.Apache HISE is Human Interactions Service Engine. It's an open source implementation of WS HumanTask specification.HISE proposal can be found her...