none
How to remove the hover and click event of the Bing map 6.2? RRS feed

  • Question

  • I was developing a website using the Bing Maps 6.2 of JavaScript version.

    I  reference the control like this 

     <script type="text/javascript" src="http://dev.ditu.live.com/mapcontrol/mapcontrol.ashx?v=6.2&mkt=cs-CZ"></script>

    I create the map like this:

     map = new VEMap('myMap');
    
        //set the longitude latitude
        var LA = new VELatLong(lat, long);
        //set the nav
        map.SetDashboardSize(VEDashboardSize.Tiny);
        //load map
        map.LoadMap(LA, zoom, VEMapStyle.Road, true, VEMapMode.Mode2D, true, 2);
        map.ClearInfoBoxStyles();
    


    And I add a self define shape to the map like this:

    var icon = "<div style='cursor:default;'><img src=\"images/clr.gif\" style=\"background-position:-882px -331px; background-image:url(images/Microblog/allMBlog.png); width:20px; height:20px;\" alt=\"\" /> </div>";
     
     if (map != null) {
    
            //get VELatLong object
            var LA = new VELatLong(lat, long);
            //create shape
            var shape = new VEShape(VEShapeType.Pushpin, LA);
            shape.SetCustomIcon(icon);
    
            //set title
            shape.SetTitle(title);
            //set description
            shape.SetDescription(inforbox);
            //add shape
            map.AddShape(shape);
    
            return shape;
        }
    
    
    


    The question is: The shape can be add on the map, but the when I hover on it, it will display a warning message like 'javascript:pushin hover ' on my left button of my IE browser. And the shape  can be clicked.

    I want to delete the click event and delete the hover display and make the shape as a normal shape with no click and hover event. How to do it and how to set it?

     


    One day a small demo!
    • Moved by Ricky_Brundritt Saturday, March 10, 2012 12:26 PM (From:Bing Maps: Map Control and Web services Development)
    Friday, December 2, 2011 5:50 AM

Answers

All replies

  • I dont have time to test this now but I suspect just removing:

     //set title
            shape.SetTitle(title);
            //set description
            shape.SetDescription(inforbox);

    Will do what you want as I dont think the control adds the click and hover events if there is nothing for the popup box to display


    Brian @ Earthware - UK interactive mapping web developers http://www.earthware.co.uk/blog | http://www.twitter.com/earthware | Windows Live Developer MVP
    Saturday, December 3, 2011 8:34 AM
    Moderator
  • Hi, Earthware

    I have tried your suggestion, but it doesn't work. I have cut the 'SetTitle()' and 'SetDescription()' methods off, but it still have the hover event and click event.  I really do not know how to do. I have the look for it in the API. But I have fond nothing helpful. Do you have any other good suggestion?


    One day a small demo!
    Tuesday, December 6, 2011 4:24 AM
  • I don't think there is no supported way to remove these events. It's best t just handle them if you want to disable the default support.


    http://rbrundritt.wordpress.com
    Tuesday, December 6, 2011 3:20 PM
  • Hi, Richard_Brundritt

    I am not clear about your reply. I am a fresh in programing. Could you tell me in more detail? BTW what do you mean by

    'just handle them if you want ti disable the default'. Could give me some demos or simple codes so solve this problem. Because I

    really have no way to handle it.

     

    Thanks! 


    One day a small demo!
    Wednesday, December 7, 2011 2:03 AM
  • Here is an example of how to disable an event:

    map.AttachEvent("onmouseover", function(e){
        if(e.elementID != null){ //only VEShapes have ID's
         return true; //disable event
        }
       });

    This will prevent the event from being passed to lower Bing Maps functionality. If you add this code right after you load the map you will find that popups will be disabled on your map when you hover over pushpins.


    http://rbrundritt.wordpress.com
    Wednesday, December 7, 2011 10:42 AM
  • Hi Richard_Brundritt,

    Thanks for your reply. But have you tried your codes? I have put these codes after my map was loaded, but it when I hover my mouse on the pushpin still occur this.   and  I click the pushpin it also can be clicked  like this .

     

    This is my test file code you can copy all of it to a html file and test.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title>Untitled Page</title>
        <script type="text/javascript" src="http://dev.ditu.live.com/mapcontrol/mapcontrol.ashx?v=6.2&mkt=cs-CZ"></script>
        <script type="text/javascript">
            window.onload = function () {
              
                CreateMap(39.88056, 116.407839, 4);
    
                AddCustomerPushpin(39.88056, 116.407839, "", "");
            }
            var icon = "<div style='cursor:default;'><img src=' C:\\Users\\v-taobai\\Desktop\\MyCatch.jpg' width:20px; height:20px;\" alt=\"\" /> </div>";
            function CreateMap(lat, long, zoom) {
    
                map = new VEMap('myMap');
    
                //set the longitude latitude
                var LA = new VELatLong(lat, long);
                //set the nav
                map.SetDashboardSize(VEDashboardSize.Tiny);
    
                
                //load map
                map.LoadMap(LA, zoom, VEMapStyle.Road, true, VEMapMode.Mode2D, true, 2);
    
                map.AttachEvent("onmouseover", function (e) {
    
                    if (e.elementID != null) { //only VEShapes have ID's
                        return true; //disable event
                    }
                });
    
                map.AttachEvent("onclick", function (e) {
                    if (e.elementID != null) { //only VEShapes have ID's
                        return true; //disable event
                    }
                });
    
                map.ClearInfoBoxStyles();
    
            }
    
            function AddCustomerPushpin(lat, long, title, inforbox) {
                if (map != null) {
    
                    //get VELatLong object
                    var LA = new VELatLong(lat, long);
                    //create shape
                    var shape = new VEShape(VEShapeType.Pushpin, LA);
                    shape.SetCustomIcon(icon);
    
                    //set title
                    //shape.SetTitle(title);
                    //set description
                    //shape.SetDescription(inforbox);
                    //add shape
                    map.AddShape(shape);
    
                    return shape;
                }
            }
    
          
        </script>
    </head>
    <body>
    <div id='myMap' style="position: relative; width: 100%; height: 400px;cursor:default;"></div>
    </body>
    </html>
    
    



    One day a small demo!
    Thursday, December 8, 2011 1:55 AM
  • The hover event will always occur, there is no supported way to disable it. The code I provided just disables the behaviour that occurs when you hover.
    http://rbrundritt.wordpress.com
    Thursday, December 8, 2011 1:11 PM
  • That is really a pity! I have used the Bing map in my program and I don't use the hover and click event, but there is still the behavior there like the picture. So it will give the users a fake impression that the shape or the pushpin can be clicked. It is really horrible!

    Thanks for your reply!


    One day a small demo!
    Friday, December 9, 2011 1:33 AM
  • v6.3 has certain limitations in terms of flexibility. Try v7 http://www.bingmapsportal.com/ISDK/AjaxV7#Pushpins2, it is flixible & fast and also easy to port
    MSFT
    Hemant Goyal
    Friday, December 9, 2011 10:06 PM