Google provides the map service and also the APIs to integrate it into our application. Sencha Touch has wrapped it inside a component named Ext.util.Map
, which provides the complete map related functionality. It uses Google Maps' JavaScript APIs, internally, to provide us a working map component. In this recipe, we will see how to make use of the Map
class.
Make sure that you have set up your development environment by following the recipes outlined in Chapter 1.
Carry out the following steps:
Create and open a new file named
ch10_02.js
and paste the following code into it:Ext.setup({ onReady: function() { var pnl = new Ext.Panel({ fullscreen: true, items : [ { xtype : 'map' } ] }); } });
Update the
index.html
file.Add the following to the
index.html
file to include Google Maps, JavaScript APIs:<script type="text/javascript" src="http://maps.google...