Sencha Touch Cookbook

Highlighting and displaying an item detail

The next level of interaction is that when the user clicks on a chart item, we may want to highlight that item and show the item detail corresponding to it. In this recipe, we will see how to achieve this.

Getting ready

Make sure that you have set up your development environment by following the recipes outlined in Chapter 1.

How to do it...

Carry out the following steps:

1. Edit the ch07_06.js file.
2. Add the following interactions to the chart's interactions array:

   {
       type: 'iteminfo',
       gesture: 'taphold',
       listeners: {
         show: function(me, item, panel) {
           panel.update(item.value[0] + " : " + item.value[1]);
         }
       }
   },
   {
       type: 'itemhighlight'
   }

3. Save the change.
4. Deploy and access it from the browser or the device of your choice. ...