地图导航小工具

Ext.namespace('Ext.ux.CAF.GIS');

Ext.ux.CAF.GIS.MapNavigation=function(config) {
    Ext.apply(this, config);
};
Ext.extend(Ext.ux.CAF.GIS.MapNavigation, Ext.util.Observable, {
    init:function(panel) {
  Ext.apply(panel, {
            onRender:panel.onRender.createSequence(function(ct, position) {
             var navigateDiv = Ext.DomHelper.append(this.el,
                {
                    tag: 'div', style:'position:absolute; z-index:23; top: 0px;'
                });
                var navHtml = '<table border="0" cellpadding="0" cellspacing="2">'+
          '<tbody><tr><td></td>'+
          '<td><img src="../images/gistools/navigate/up.gif" style="" onclick="clickMove(\'up\')" title="向上" height="20" width="20"></td>'+
          '<td></td></tr><tr>'+
          '<td><img src="../images/gistools/navigate/left.gif" style="" onclick="clickMove(\'left\')" title="向左" height="20" width="20"></td> '+
          '<td><img src="../images/gistools/navigate/zoom.gif" style="" onclick="fullExt();" title="还原" height="20" width="20"></td> '+
          '<td><img src="../images/gistools/navigate/right.gif" style="" onclick="clickMove(\'right\')" title="向右" height="20" width="20"></td>'+ 
          '</tr><tr><td></td>'+
          '<td><img src="../images/gistools/navigate/down.gif" style="" onclick="clickMove(\'down\')" title="向下" height="20" width="20"></td> '+
          '<td></td></tr><tr><td></td>'+
          '<td><img src="../images/gistools/navigate/zoom_in.gif" style="" onclick="zoomIn();" title="放大" height="20" width="20"></td> '+
          '<td></td></tr><tr><td></td>'+
          '<td><img src="../images/gistools/navigate/zoom_out.gif" style="" onclick="zoomOut();" title="缩小" height="20" width="20"></td> '+
          '<td></td></tr></tbody></table>';
                if(navigateDiv)
                {
                 Ext.DomHelper.insertHtml('beforeEnd',navigateDiv,navHtml);
                }
            })
        });
     }
});

 用一种比较原始的办法实现一个地图导航的小工具栏.