你好我点击事件已实现但没什么hapens。我正在使用MVC Extjs我知道如何在javascript中实现例如jsfiddle简单点击事件但在extjs中我应该把代码放在窗口中我有gmappanel如何在控制器中处理这个我不知道怎么做...帮助我应该把这段代码放在哪里：
var map = Ext.getCmp('gmapForm');
google.maps.event.addListener(map, 'click', function(e) {
var lat = e.latLng.lat(); // lat of clicked point
var lng = e.latLng.lng(); // lng of clicked point
var markerId = getMarkerUniqueId(lat, lng); // an that will be used to cache this marker in markers object.
var marker = new google.maps.Marker({
position: getLatLng(lat, lng),
map: map,
id: 'marker_' + markerId
});
});
这是我的观点，没有工作的听众没有人工作我想知道：
Ext.define('App.view.App', {
extend: 'Ext.window.Window',
alias: 'widget.appform',
title:'',
operation:'',
resizable: false,
modal:true,
initComponent: function () {
me = this;
this.autoShow = true;
this.width = 550;
this.height = 650;
this.items = [
{
xtype: 'textfield',
name: 'title',
value:me.login,
fieldLabel: 'Title',
allowBlank: false,
width:330,
style:{
marginTop:'10px',
marginLeft:'20px',
marginRight:'20px'
}
},
{
title: 'Google Map',
width:535,
height:800,
// frame:true,
id:'gmapForm',
// height: '100%',
xtype: 'gmappanel',
gmapType: 'map',
center: {
geoCodeAddr: "221B Baker Street",
marker: {
title: 'Holmes Home'
}
},
mapConfOpts: ['enableScrollWheelZoom','enableDoubleClickZoom','enableDragging'],
mapControls: ['GSmallMapControl','GMapTypeControl','NonExistantControl'],
mapOptions : {
mapTypeId: google.maps.MapTypeId.ROADMAP
},
listeners: {
maprender: function(extMapComponent, googleMapComp){
var marker = new google.maps.Marker({
position: position = new google.maps.LatLng (42.16726190,-87.83146810),
// position: patientPosition, //patientPosition initialized in geocodePatientAddress() function in Home.js
map: googleMapComp,
animation: google.maps.Animation.DROP,
draggable: false,
title: 'Patient Location'
});
google.maps.event.addListener(marker, 'click', function() {
// infowindow.open(googleMapComp, marker);
console.log('sssssssssss');
});
google.maps.event.addListener(marker, 'mouseout', function() {
infowindow.close(googleMapComp, marker);
});
}
},
handler : function () {
google.maps.event.addListener(marker, 'click', function() {
// infowindow.open(googleMapComp, marker);
console.log('sssssssssss');
});
// this.up('window').down('form').getForm().reset();
}
/* google.maps.event.addListener(gObject, "click", function(e){
alert('test');
})*/
}
];
this.buttons = [
{
text:me.operation,
name: me.operation,
scope: this
},
];
console.log(arguments);
this.callParent(arguments);
}
});
这是我的控制器：
Ext.define('App.controller.AppController', {
extend: 'Ext.app.Controller',
views: [
'App.AppPanelView',
'App.AppForm'
],
stores: ['App.Apptore'],
models: ['App.AppModel'],
refs: [
{ ref: 'App', selector: 'AppForm' }
],
init: function () {
this.control({
'App button[name="Add"]':{
click:this.addPersonForm,
afterrender:this.addMapListener
}
});
},
selectedRow:null,
countryId:null,
personProfile:null,
modalImageIndex:null,
imageId:null,
avatar:"",
addMarker:function(){
console.log("aaaaaaa");
var win= Ext.widget('AppForm',{title:'Add Group',operation:'Add'});
var trafficMap = Ext.getCmp('gmapForm');
// var marker_icon = new google.maps.MarkerImage('images/map/' + thisIcon + '.png', new google.maps.Size(32, 32));
/*var trafficMarker = new google.maps.Marker({
position: new google.maps.LatLng(alert.lat, alert.lon),
map: trafficMap,
// icon: marker_icon,
id: 'trafficAlertIcon' *//*i*//*
});*/
/*var options = {
lat:3.951941,
lng:-102.052002,
marker: {title:"Hello World!"},
listeners: {
click: function(e){
}
}
};
console.log(trafficMap);
var lat = 3.951941,
lng = 102.052002;
var mpoint = new google.maps.LatLng(lat,lng);
trafficMap.addMarker(mpoint,options.marker,false,false, options.listeners);*/
/* google.maps.event.addListener(trafficMarker, 'mousedown', function()
{
console.log('touched marker');
*//* trafficTabPanel.layout.setActiveItem(1, {type: 'slide', direction: 'left'});
LoadIncidentMap(this.id.substring(16));*//*
});
*/
/* google.maps.event.addListener(trafficMap, "click", function (e) {
console.log('click');
//lat and lng is available in e object
// var latLng = e.latLng;
});*/
var addMarker = google.maps.event.addListener(trafficMap, 'click', function(e) {
var lat = e.latLng.lat(); // lat of clicked point
var lng = e.latLng.lng(); // lng of clicked point
var markerId = getMarkerUniqueId(lat, lng); // an that will be used to cache this marker in markers object.
var marker = new google.maps.Marker({
position: getLatLng(lat, lng),
map: map,
id: 'marker_' + markerId
});
console.log(lat+ " "+ lng);
// markers[markerId] = marker; // cache marker in markers object
// bindMarkerEvents(marker); // bind right click event to marker
});
addMarker;
console.log('clickaa');
//win.show();
},
addMapListener:function() {
console.log("A1");
var trafficMap = Ext.getCmp('gmapForm');
google.maps.event.addListener(trafficMap, 'click', function(e) {
console.log("A3");
var lat = e.latLng.lat(); // lat of clicked point
var lng = e.latLng.lng(); // lng of clicked point
var markerId = getMarkerUniqueId(lat, lng); // an that will be used to cache this marker in markers object.
var marker = new google.maps.Marker({
position: getLatLng(lat, lng),
map: map,
id: 'marker_' + markerId
});
console.log(lat+" "+lng);
// markers[markerId] = marker; // cache marker in markers object
// bindMarkerEvents(marker); // bind right click event to marker
});
console.log("A22");
var map;
// map = new google.maps.Map($('#map')[0], myOptions);
/* var myOptions = {
zoom: 7,
center: new google.maps.LatLng(46.87916, -3.32910),
mapTypeId: 'roadmap'
};
google.maps.event.addListener(map, 'click', function(e) {
console.log(A2);
var lat = e.latLng.lat(); // lat of clicked point
var lng = e.latLng.lng(); // lng of clicked point
var markerId = getMarkerUniqueId(lat, lng); // an that will be used to cache this marker in markers object.
var marker = new google.maps.Marker({
position: getLatLng(lat, lng),
map: map,
id: 'marker_' + markerId
});
markers[markerId] = marker; // cache marker in markers object
bindMarkerEvents(marker); // bind right click event to marker
});*/
}
});
我已经尝试了为什么extjs为stackoverflow example这里的代码放在哪里