简体   繁体   中英

GMaps.js setContextMenu

I have managed to add a context menu to a map using GMaps.js as per their example below

map.setContextMenu({
  control: 'map',
    options: [{
        title: 'Add marker',
        name: 'add_marker',
        action: function(e) {
            this.addMarker({
              lat: e.latLng.lat(),
              lng: e.latLng.lng(),
              title: 'New marker'
            });
        }
    }, {
        title: 'Center here',
        name: 'center_here',
        action: function(e) {
        this.setCenter(e.latLng.lat(), e.latLng.lng());
    }
  }]
});

However I cannot seem to add a context menu to a marker.

Could someone post how to do this

Thanks

Do you mean an infoWindow as demoed here? http://hpneo.github.com/gmaps/examples/markers.html

If you look at the source for that page, you'll see you just need to add

infoWindow: {
    content: '<p>HTML Content</p>'
}

to your addMarker bit, ie. below the title. It's real easy! :)

This code work perfect for me, also if you can't see the contextMenu maybe you should try with right click it shows up the menu !!

map.setContextMenu({
        control: 'map',
        options: [{
            title: 'Add marker',
            name: 'add_marker',
            action: function(e){
                this.addMarker({
                    lat: e.latLng.lat(),
                    lng: e.latLng.lng(),
                    animation: google.maps.Animation.DROP,
                    draggable:true,
                    title: 'New Marker'
                });
                this.hideContextMenu();
            }
        }, {
            title: 'Center here',
            name: 'center_here',
            action: function(e){
                this.setCenter(e.latLng.lat(), e.latLng.lng());
            }
        }]
    });
    map.setContextMenu({
        control: 'marker',
        options: [{
            title: 'Center here',
            name: 'center_here',
            action: function(e){
                this.setCenter(e.latLng.lat(), e.latLng.lng());
            }
        }]
    });

右键点击带有gmaps的地图

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM