Question

如何在文档https://docs.sencha.com/extjs/4.2.3/#!/api/Ext.ux.GMapPanel-method-addListener中强制点击ExtJs中的事件我知道javascritpt但是ExtJs如何制作google map js 我已经制作了很多点击听众，但没有成功，请告诉你点击应该在控制器中通过引用等等吗？

 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);
        }
    });

Answer 1

extjs的谷歌地图插件有问题imo。

您可以直接与google maps api和extjs集成。

以下是搜索和叠加功能的示例：

https://fiddle.sencha.com/#fiddle/cva

至于您将使用的点击事件：

marker.addListener('click', function() {
map.setZoom(8);
map.setCenter(marker.getPosition());
 });

https://developers.google.com/maps/documentation/javascript/events

点击GmapPanel中的事件

1 个答案: