BY MARKUS SPRUNCK The example application demonstrates the implementation of a minimal Finite Element Method (FEM) Simulation running in a web browser and uses device orientation signals. This works on mobile devices (see Figure 1 and 2). You may find the application under http://mobilefemexample.appspot.com. The implementation is based on paper.js and Google Web Toolkit. It has been developed with GWT 2.5 and App Engine SDK 1.7.3. It's tested with Chrome Browser under iOS and Android. Expected ResultMobile BrowserWeb applications on different mobile devices with different browsers are a real mess. There are dozens of different layouts and case differentiation needed. In this case the device orientation is quite easy. Especially on Android every browser behaves a little bit different.
Desktop BrowserYou may also test the application in a desktop browser. In this case a small gui enables the manual input of the device orientation. In figure 3 the control is marked in red color. If you are familiar with the basics you may skip this chapter. In principle FEM is quite simple. All is about creating a large linear equation system that is an approximation of the real physical behavior. The following four steps show a simplified view of what happens in structural mechanics  starting with a simple spring and ending with a solid triangular element for FEM. Figure 4: Simple spring follows one linear equation A simple spring has just one equation. The resulting force is linear dependent from the displacement. This is true as long the displacement is small compared with the size of the spring. Wikipedia says "In 1676 British physicist Robert Hooke discovered the principle behind springs' action, that the force it exerts is proportional to its extension, now called Hooke's law." [1] So this is not really new. Figure 5: The 2D spring has two linear equation The same spring in two dimensions needs two linear equations. The important point here is that the equations can also expressed with matrices. This makes it easier to because you avoid to write a lot equations. Figure 4: Three springs have six linear equations and the stiffness matrix has just a filled diagonal. Putting now three springs together to a triangle leads to six linear equations, because you have now tree points with two degrees of freedom. The stiffness matrix of this system is very simple, each node sums up the stiffness components from two springs. Figure 5: A triangle has six linear equations and the stiffness matrix is more complex. A solid triangular has the same equations just the element stiffness matrix looks different. It is dependent on the material and geometry. Now there a just two additional things to do.
A lot of real world problems can easily be reduced to two dimensions, but it is not difficult for you to extend this code also to three dimensional numerical tasks. Even if you are not familiar with physics  it makes fun to create own models and just playing with it.
Lessons Learned
References

Read More >