Interacting with a multi-touch device

Today, with the proliferation of multi-touch devices, any visualization that targets mass consumption needs to worry about its interact-ability not only through the traditional pointing device but also through multi-touches and gestures. In this recipe, we will explore touch support offered by D3 to see how it can be leveraged to generate some pretty interesting interaction with multi-touch-capable devices.

Getting ready

Open your local copy of the following file in your web browser:

https://github.com/NickQiZhu/d3-cookbook-v2/blob/master/src/chapter10/touch.html .

How to do it...

In this recipe, we will generate a progress-circle around the user's touches, and once the progress is completed, a subsequent ripple effect will be triggered around the circle. However, if the user prematurely ends their touch, we shall stop the progress-circle without generating the ripples:

<script type="text/javascript"> 
    var initR = 100,  
      ...