Add are dynamic marker in GmapPanel - EXTJS 4

Question

this is create googlemap panel with id mygooglemap code

var layout = Ext.create('Ext.panel.Panel', {
            //renderTo: 'layout',
            width: window.innerWidth,
            height: window.innerHeight,
            //title: 'Border Layout', //no title will be blank
            layout: 'border',
            items: [{
                title: 'Message List',
                region: 'south',     // position for region
                xtype: 'panel',
                height: 100,
                split: true,         // enable resizing
                collapsible: true,
                margins: '0 5 5 5',
                collapsed: true
            },tree,{
                    xtype: 'gmappanel',
                    id : 'mygooglemap',
                    gmapType: 'map',
                    zoomLevel: 7,
                    mapConfOpts: ['enableScrollWheelZoom','enableDoubleClickZoom','enableDragging'],
                    mapControls: ['GSmallMapControl','GMapTypeControl','NonExistantControl'],  
                    setCenter: {
                        lat: 3.951941,
                        lng: 102.052002,
                    }
                }],
            renderTo: Ext.getBody() //get the body and display Layout at there
        });
    });

this is when check tree clicked checkbox and status of checkbox are true then add the marker on googlemap

 Ext.define('GoogleMarkerModel', {
            extend: 'Ext.data.Model',
            fields: ['Locating','MainPower','Acc','PowerOff','Alarm','Speed','Direction','Latitude','Longitude','DateTime','MainID', 'DeviceID','IOState','OilState']
        });

        var MarkerStore = Ext.create('Ext.data.JsonStore', {
            model: 'GoogleMarkerModel',
            autoLoad: true,
            proxy: {
                type: 'ajax',
                url: 'get-googlemarker.php',
                baseParams: {  //here you can define params you want to be sent on each request from this store
                            mainid: 'value1'
                            },
                reader: {
                    type: 'json',
                    root: 'images'
                }
            }
        });

        tree.on('checkchange', function(node){
            var data = node.data;
            Ext.MessageBox.show({
            title: 'Changed checkbox status',
            msg: 'MainID: ' + data.MainID + ' <br /> Checkbox status: ' + data.checked,
            icon: Ext.MessageBox.INFO
            });
            if (data.checked = true){

                MarkerStore.load({
                            params: {
                                    mainid: data.MainID
                                    }
                            })  
                         //after markerstore get the longtitude and latitude,add google map a marker at here
            }
        })

when checkbox are checked,then will pass a id to get-googlemarker.php and get the latest longitude and latitude on the database store in MarkerStore,and show the marker on googlemap.
all coding are work done,just left the add marker on googlemap, how to add a marker on googlemap dynamically?
marker will create inside the function tree.on('checkchange', function(node)

Answer 1

    function addDoctorLocation(options) 
    {
     var gm = Ext.getCmp('mygooglemap');
     var mpoint = new google.maps.LatLng(options.lat,options.lng);
     var marker = gm.addMarker(mpoint,options.marker,false,false, options.listeners);
    }

tree.on('checkchange', function(node){
        var data = node.data;

        if (data.checked == true){

        var options = {
        lat:lati,
        lng:longi,
        marker: {title:"Hello World!"},
        listeners: {
                     click: function(e){

                                         }
                    }     
        }     
        addDoctorLocation(options);           
        }       
    })

SOLVED with this code